jQuery UI connectToSortable 如何访问删除的元素属性

Question

我正在使用连接到可排序列表的 jQuery UI 可拖动列表，除了当将项目拖放到可排序列表上时，它似乎无法正确克隆原始元素 id 或任何关联的 jquery 数据( )。

奇怪的是，这些东西可以从接收器函数内部获得，但它似乎并没有真正将它们保存到元素中，因此像可排序列表的更新函数这样的东西永远不会正确地看到新删除的元素，因为新的 li 元素不会确实有一个ID。

我做错了什么？!

Javascript:

$(document).ready(function () {
    $("#dest").sortable( {
      update : function () { 
          onUpdate();
        },
      receive: function(event, ui) {
          alert("dropped item ID: "+ui.item.attr('id'));
        }
    });

    jQuery('#src > li').draggable({helper:'clone',connectToSortable:'#dest'});
});

function onUpdate() {
    var order = $('#dest').sortable('toArray');
    var txt = "Order: "+order;

    $("#info").text(txt);


}

HTML:

Source List (dragable):
<div>
    <ul id="src">
        <li id="src_0">src 0</li>
        <li id="src_1">src 1</li>
        <li id="src_2">src 2</li>
    </ul>
</div>

Target List (sortable):  
<div>
    <ul id="dest">
        <li id="dest_0">dest 0</li>
        <li id="dest_1">dest 1</li>
        <li id="dest_2">dest 2</li>
    </ul>
</div>

<span id="info">
    Waiting update...
</span>

演示地址:http://jsfiddle.net/h3WJH/1/

Answer 1

我相信 jQuery 是故意这样做的，因为 ID 旨在识别页面上的单个元素。尝试使用$.data()存储信息。

看看这个:http://jsfiddle.net/wngchng87/h3WJH/11/