2

很多时候，我的元素与附加功能挂钩，例如：

$('.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 个用于初始页面加载，另一个用于重新连接动态生成的新元素。这不是 DRY 代码，效率不高。

这真的是完成这项工作的唯一方法，还是有其他最佳实践？我的直觉告诉我必须有比这更有效的东西（也有助于 DRY 代码）。

更新

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

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

但我尝试使用自定义设置插件，如 .autocomplete，但没有成功。我试过这个：

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

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

4

4 回答 4

3

使用live()：

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

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

于 2009-10-17T05:49:59.730 回答
3

.live() 文档说...

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

所以我看了一下liveQuery，我认为它可以完全满足您的需求，如下所示：

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

看起来很方便！

于 2009-10-17T08:29:10.427 回答
2

我认为您可以使用 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 事件触发时执行。

于 2009-10-17T06:34:48.267 回答
1

在这种情况下，我通常会发现自己使用一个执行绑定/解除绑定的 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') 例如。

于 2009-10-17T12:50:14.403 回答