JQuery UI可排序列表更新

你好Iam使用Jquery 1.6.2和JqueryUI 1.8.16 我有一个可排序的列表JqueryUI.Each Li项目有一个按钮（带X），从列表中删除当前的李项目。另外我使用对话框将更多的li项添加到ul列表中。尽管我的项目在添加新的li项目后的初始化过程中运行良好，但删除按钮不起作用，附加的项目不起作用，那些第一次工作正常，排序选项也可以正常工作。这里是我的代码JQuery UI可排序列表更新

$.noConflict(); 
jQuery(document).ready(function($) { 
//the sortbale list init 
$("#sortable").sortable({ 
    placeholder: "ui-state-highlight" 
}); 

//when a remove button with class .remo is clicked remove the parent li 
$(".remo").click(function() { 
      $(this).parent().remove(); 
     }); 

//and the dialog to add more li items 
$("#dialog").dialog({ 
      autoOpen: false, 
      height: 500, 
      width: 550, 
      modal: true, 
      show: "blind", 
      hide: "explode", 
     buttons: { 
       Add: function() { 
       if($("#mark").val()!="" && $("#series").val()!=""){ 
     var addme = "<li >a new li item <div class='remo'>x</div></li>"; 
        $("#sortable").append(addme); 
        $(this).dialog("close"); 
              } 
       }, 
       Cancel: function() { 
        $(this).dialog("close"); 
       } 
      } 

     }); 

});//end of dom ready

而我的HTML代码

<div id="dialog" title="Manage ul "> 
<b>Click add for a new one</b><br> 
</div> 
<!--and the sortable list--> 
<ul id="sortable" style="list-style-type: none;margin: 0;padding: 0;"> 
     <li>Li 1 <div class="remo" >x</div></li> 
    <li >Li 2 <button class="remo">x</button> </li> 
    <li >Li 3 <button class="remo" >x</button> </li> 
</ul>

有什么建议？

来源

2012-01-05 Theodore

的事件处理程序（当与click或bind结合的）仅适用于当前选择匹配元素。

使用delegate（jQuery中< 1.7）或on（jQuery的> = 1.7）到事件处理程序绑定到选择器现在或将来匹配元素。所以你的情况使用delegate：

$("#sortable").delegate(".remo", "click", function() { 
    $(this).parent().remove(); 
});

例子：http://jsfiddle.net/bzKzs/

来源

2012-01-05 02:09:07

真棒！非常感谢！ – Theodore 2012-01-05 02:15:36

JQuery UI可排序列表更新

回答

相关问题