Question

我经常将元素挂钩到添加的功能，例如：

$('.myfav').autocomplete();
$('.myfav').datepicker();
$('.myfav').click(somefunction);

但是当通过某些代码动态生成此类的更多实例时，新的$('.myfav')已经死了，需要重新布线，所以我这样做：

$("#somelink").click(function(){
     //generate 10 new $('.myfav') and append them to the DOM
     //re-wire them again as in the block above
     $('.myfav').autocomplete();
     $('.myfav').datepicker();
     $('.myfav').click(somefunction);
});

这意味着我最终拥有2个相同的代码块，1个用于初始页面加载，1个用于重新连接动态生成的新元素。这不是DRY代码，效率不高。

这真的是完成这项工作的唯一方法，还是有其他最佳做法？我的直觉告诉我，有一些比这更有效的东西（也是为了帮助干掉代码）。

更新

看起来.live与.click的效果很好，正如cletus所解释的那样。

$('.myfav').live("click", somefunction);

但我尝试使用自定义设置的插件，例如.autocomplete，但它无效。我试过这个：

$('.myfav').live("click", autocomplete("somefile.php", {max: 15, mustMatch: true}));

所以直播看起来不能处理这些自定义插件（当然我可能错了，如果你知道的话请更新）

Answer 1

使用live()：

$(".myfav").live("click", somefunction);

这会将该事件处理程序绑定到<{strong> live()调用后动态创建的元素。

Answer 2

.live（）文档说......

.live不支持liveQuery提供的无事件样式回调。只有事件处理程序可以与.live绑定。

所以我看了一下liveQuery，我认为它会完全符合你的要求：

$('.myfav').livequery(function() {
  $(this).autocomplete();
  $(this).datepicker();
  $(this).click(somefunction);
});

好像很方便！

Answer 3

我认为你可以使用live（）;但不是你如何编写它。

您当前的实施：

$('.myfav').live("click", autocomplete("somefile.php", {max: 15, mustMatch: true}));

这将立即执行自动完成，而不是在jQuery找到class =“myfav”

的新元素时
您应该使用以下语法：

$('.myfav').live("click", function () { $('.myfav').autocomplete("somefile.php", {max: 15, mustMatch: true}) });

您可以在匿名函数中使用所有正常的语法，函数等。

我认为这会奏效，但我还没有测试过。它的作用是向jQuery发送一个函数，以便在click事件触发时执行。

Answer 4

在这种情况下，我通常会发现自己使用了一个执行绑定/解绑定的init函数，然后在ajaxComplete等上调用它。在这种情况下，它可能看起来像这样：

function init()
{
    $('.myfav').unbind('click');
    $('.myfav').autocomplete('disable');
    $('.myfav').datepicker('disable');
    $('.myfav').autocomplete();
    $('.myfav').datepicker();
    $('.myfav').click(somefunction);
}

当然，根据插件的不同，unbind可能看起来不同，我相信jQueryUI使用$（'。myfav'）。draggable（'destroy'）例如。

Jquery - （重新）连接动态生成的元素

4 个答案: