2

嗨,当 ajax 加载动态内容时,每次都会遇到同样的问题,例如:评论或任何帖子都可以正常工作。但是在我刷新页面之前,评论按钮不起作用。在我喜欢的脚本下面帮助我如何解决这个问题

$(".comment_like").click(function()
{
var cID = $(this).attr("ccid");
var cREL = $(this).attr("rel");
var cbox = $(this).attr("box_id");
var cowner = $(this).attr("ownercli");
var cURL='comment_like.php';
var dataString = 'msg_id=' + cID +'&rel='+ cREL+ '&owner='+ cowner+ '&cbox='+ cbox;
if(cREL=='Like')
{
$('#c'+cID).html('Unlike:').attr('rel', 'Unlike').attr('title', 'Unlike');
}
else
{
$('#c'+cID).attr('rel', 'Like').attr('title', 'Like').html('Like:');
}
        xhr = $.ajax({
            type: "POST",
            url: cURL,
            data: dataString,
            cache: false
        }).done(function(htmlc){
      $('.cml'+cID).html(htmlc);
        });
});
4

2 回答 2

2

假设 $(".comment_like") 按钮位于从 ajax 调用返回的 HTML 中是否安全?如果是这样,这就是 jQuery "on" 绑定有用的地方。与其绑定在加载内容之前不存在的按钮本身,不如将事件侦听器绑定到元素可能最终位于其中的容器。简而言之,当在该容器上发生单击时,jQuery 会检查单击的元素以查看它是否匹配并触发您的处理程序。

阅读:http ://api.jquery.com/on/

这样做是为了动态加载内容,并防止绑定数百个事件处理程序。

基于此,而不是

$(".comment_like").click(function() {...});

尝试

$('#container').on('click','.comment_like',function() {...});

其中 #container 是包含您正在加载的 HTML 的包装器。

于 2013-11-06T22:45:48.963 回答
0

单击事件仅绑定到 DOM 中已有的元素。如果您从 ajax 调用加载容器,则单击事件将不会绑定到它。这不是真正正确的 IMO,但是您可以通过将点击事件添加到 .done 函数中来快速解决此问题。一旦 ajax 调用完成,click 事件就会绑定到动态添加到 DOM 的元素。

于 2013-11-06T22:59:08.893 回答