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可排序列表更新

回答

相關問題