Question

我将JQuery UI Selectable附加到UL element。但内部的li item 动态创建。当然，我无法进行选择那些，如何附上plugin's function to dynamic created elements in JQuery！？

E.g：

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

</ul>

[更新]

JQuery代码：

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

我在哪里使用delegate或live！？

delegate和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');将是唯一触发的提醒。

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

2 个答案: