我最近被迫升级：
- j查询从 1.7.1 到 1.8.3
- jQueryUI 从 1.8.9 到 1.9.2
(我被迫升级，以便与Blueimp的jQuery文件上传的最新版本兼容。
我有以下代码，在(1.7.1/1.8.9)下完美运行
$( "div.archive li" )
.draggable({ // make the archive-icons draggable and connect to the album(s)
connectToSortable: handleSortable, // ,"#album_45 ul", //
helper: "clone", // (helper must be set to 'clone' in order to work flawlessly),
revert: "invalid",
appendTo: "body"})
和
sortableUL.sortable({
helper: 'clone',
appendTo: "body",
update : function () {
var serializedSequence = sortableUL.sortable('serialize'); // Fails in jQueryui/1.8.21 !!
$.ajax({
url: "/callback/upAlbum",
type: "post",
data: serializedSequence,
success: function(htmlData){
sortableUL.html(htmlData);
recursiveSortable(albumID, joPanel); // once the newly ordered zone-album has been read, recurse back to: make list sortable & slidable
}
}); // END $.ajax
} // END update : function ()
});
上面的代码在较旧的jQuery和jQueryUI下工作正常，但在新版本下失败。如果我降级回旧版本，代码将再次工作(但是我的jQuery文件上传器将无法工作！
新设置中不会生成任何错误消息。但是，会出现以下情况：
可拖动的列表是<li id="icon_1234">.当这些被放入.sortable()时，它们被接受。因此，他们成为.sortable()<ul>中的<li>.但是，此时id="icon_1234"将被删除。<li>的其他属性保留在原位。
更新：实际上，当<li>附加到<body>时，id="icon_1234"会被删除，因此.droppable()显然不是问题的原因。但是，注释掉appendTo:选项不会改变问题。
当然，如果没有id="icon_1234"，新掉落的<li>将无法在以下语句中幸存下来：
var serializedSequence = sortableUL.sortable('serialize');
因此，在更新回调之后，新删除的<li>将从.sortable()列表中消失。
我真的没有预感如何解决这个问题......
好吧，让我分享一下我的发现，以及我一路上忍受的吊索和箭。
我的理解是，jQuery UI 大神认为将id放入sortable时从draggable中删除是一种功能。这似乎是在 1.8.9 和 1.9.2 之间引入的。
理由是人们不想要重复的ID。如果是这样，.sortable('serialize')方法不应查找id=""，而应查找<li>的其他属性。(但是，默认情况下，序列化方法继续查找id。
所以，这是我的解决方法。您的列表项过去如下所示：
<li id="foo_123">
我们需要为这些<li>添加一个属性：
<li id="foo_123" bar="foo_123">
接下来，我们指示序列化方法查找新属性，而不是 id：
var serializedSequence = $('#sortableUL').sortable('serialize',{
key: 'foo',
attribute: 'bar'
});
这应该可以解决问题。但是，就我而言，还有一个吊索/箭头。serialize方法未生成正确序列化的数组。(我不知道为什么，但我不能在这个功能上浪费更多时间。因此，我需要补充：
serializedSequence = serializedSequence.replace(/=/g,"[]=");
更新：这是其他人为类似解决方案制作的小提琴。
希望这有帮助...
补充 Ivo Renkema 的上述答案，您可以在密钥上使用数组推送：
var serializedSequence = $('#sortableUL').sortable('serialize',{
key: 'foo[]',
attribute: 'bar'
});
这将产生数组 foo[]=1&foo[]=2...
在这里更新小提琴