3

我有一个简单的函数，它遍历页面并向每个匹配的元素添加一个 CSS 类，使用.each(). 我也在不断地用 AJAX 更新页面，在第一次改变事情的 AJAX 更新之后，该功能不再适用。

代码：

$("div.col-conversation span.label-sticky").each(function () {
    $(this).closest('li').addClass('stickyhighlight');
});

我理解为什么它在第一个 AJAX 事件之后不起作用并尝试使用.live()，或者.delegate()但似乎您不能绑定不是事件的东西（即您只能绑定到单击、悬停等）使用这种方法，所以.each()行不通。

有没有一种简单的方法来执行这个函数而不将它包含在 AJAX 成功回调中并且不使用像 livequery 这样的插件，这可能是矫枉过正？

4

2 回答 2

1

可能比为每个匹配项附加事件处理程序更好的是使用带有选择器参数的 jQuery.on() 附加事件。它允许您执行以下操作：

$('#container').on('click', '.yourClass', function(event){ doStuff(); });

和

<div id="container">
    <span class="yourClass">...</span>
    <div class="yourClass">...</div>
    <anything class="yourClass">...</anything>
</div>

这意味着只需要激活一个事件侦听器，而不是类中的每个项目一个事件。这也意味着如果您将项目添加到容器中，则无需更新侦听器。它的性能更好，更容易处理。

查看jQuery.com了解更多关于 .on() 的信息。

于 2013-02-27T02:06:56.040 回答
1

我认为这对你有用：

$('body').on('mychange','div.col-conversation span.label-sticky',function () {
   $(this).closest('li').addClass('stickyhighlight');
});

将此添加到您的 ajax 成功函数中：

$('body').trigger('mychange');

或者，如果您真的不想（或不能）修改 ajax 成功函数：

setInterval(function() {
   $('div.col-conversation span.label-sticky').each(function () {
       $(this).closest('li').addClass('stickyhighlight');
   });
},100);
于 2013-02-27T02:14:35.490 回答