jquery - 如何将插件的功能附加到 JQuery 中的动态创建元素？

Question

我被附加JQuery UI Selectable到一个UL element。但是li item里面是动态创建的。当然，我无法选择它们。那么，如何附加plugin's function to dynamic created elements in JQuery！？

例如：

<ul id="selectable">
    <li class="dataItem">item dynamic created here but you can't select me</li>

</ul>

[更新]

jQuery代码：

$( "#selectable" ).selectable();

我在哪里使用delegate或live！？

delegateand的live用法就是这样绑定事件：

$('#selectable').delegate('li','click',function(){
  // do something here
});

但它们selectable plugin's events是：

Supply a callback function to handle the selected event as an init option.

$( ".selectable" ).selectable({
   selected: function(event, ui) { ... }
});

并且新添加的项目没有得到如下selectable plugin's状态：

ui-selectee

So,should I re-attach the plugin at every time when a new item added!?

非常感谢你！！

Answer 1

jQuery 提供的.live将完全满足您的需求。

“将处理程序附加到与当前选择器匹配的所有元素的事件，现在和将来。”

Answer 2

使用.live()或.delegate()

---

好吧，对于您的更新，请在您在 DOM$( "#selectable" ).selectable();中附加元素之后立即调用。#selectable

例如，

$('#selectable').click(function(){
    alert('I will not fire');
});

$('body').append('<ul id="selectable"><li class="dataItem">item</li></ul>');

$('#selectable').click(function(){
    alert('I will fire');
});

alert('I will fire');将是唯一触发的警报。