Question

我有一个脚本可以将操作附加到HTML代码中的某些对象上。比方说，一个类with-counter的textarea，用于更新在其上键入的字符数;监听mouseover发生时的列表;正在被ajaxified的链接;等等。

e.g：

$("textarea.with-counter").keydown(function(){
   var text_len = $(this).val().length;
   //manipulate the span/etc that has the counter
});
$("a.ajax_link").click(function(){
   var loc = $(this).attr("href");
   //load the value of href via $.ajax to some div
   //yadda yadda
});

最初的情况是：从数据库加载相对少量的HTML，然后将操作附加到它（实现上面的代码片段）。现在，我有这个脚本加载另一块相同格式的HTML。新加载的HTML应该接收相同的操作。

问题的底线是：我不想将这些操作附加到我之前附加过这些操作的对象/元素。随着更新的HTML大量加载，动作附加的速度越慢。当我想要发生的是必须将操作仅附加到新加载的HTML块时，操作将附加到先前加载的HTML（请记住它们具有这些操作）。有时FF冻结并会询问我是否要继续脚本过程。

Ergo，问题是：有没有办法让我可以选择绕过将动作附加到我之前附加动作的元素上？

*万分感谢，大家。

Answer 1

是的，将您的动作绑定代码重构为一个接受上下文的函数 - 一个在其中搜索的选择器或元素。然后更改所有选择器以将上下文作为第二个参数传递给jQuery $函数。

然后，您可以为给定的新容器元素调用此函数。

E.g。

function bindActions(context) {
    context = context || $('body'); // use whole page if no context specified
$("textarea.with-counter", context).keydown(function(){
   var text_len = $(this).val().length;
   //manipulate the span/etc that has the counter
});
$("a.ajax_link", context).click(function(){
   var loc = $(this).attr("href");
   //load the value of href via $.ajax to some div
   //yadda yadda
});
}

// add new content to a div with id of "new3", for example, then:
bindActions('#new3');

Answer 2

只需使用直播活动，例如$(...).live('eventname', function() { ... })

它们没有附加到元素本身，而是附加到文档，所以感谢事件冒泡它们适用于所有匹配的事件，包括那些在.live()调用时不存在的事件。

绕过JavaScript动作附加到对象

2 个答案: