Javascript jquery sortable:已排序项触发重新排序

我有一个表示

div

层的项目列表。当我对其中一个列表项进行排序时，我希望对它们各自的div层也进行排序

列表：这些项目是可排序的

---

绑定可排序的

change

事件（如果需要实时更新）或

stop

（仅读取结束状态），并相应地手动重新排序div。

绑定可排序的

change

事件（如果需要实时更新）或

stop

（仅读取结束状态），并相应地手动重新排序div。

如果我得到了您的要求，则此代码可能是您想要的：

var indexBefore=-1；
函数getIndex（itm，列表）{
var i；
对于（i=0；i=list.length？-1:i；
}
$（“#可排序”）。可排序({
开始：功能（事件、用户界面）{
indexBefore=getIndex（ui.item，$（'#可排序li'）；
},
停止：功能（事件、用户界面）{
var indexAfter=getIndex（ui.item，$（“#可排序li”）；
if（indexBefore==indexAfter）返回；
如果（indexBefore如果我得到了您的要求，则此代码可能是您想要的：


var indexBefore=-1；
函数getIndex（itm，列表）{
var i；
对于（i=0；i=list.length？-1:i；
}
$（“#可排序”）。可排序({
开始：功能（事件、用户界面）{
indexBefore=getIndex（ui.item，$（'#可排序li'）；
},
停止：功能（事件、用户界面）{
var indexAfter=getIndex（ui.item，$（“#可排序li”）；
if（indexBefore==indexAfter）返回；
如果（indexBeforeMay）我问您将如何对它们进行排序？@0x90，这个名称有点误导性-jQuery sortable意味着您可以将项目拖放到新的顺序中。因此我假设OP的意思是，您抓取
1
并将其拖到
3
下面（导致Div2 Div3 Div1），应用程序会自动重新排列
div_容器中的内容（分为div 2项、div 3项、div 1项）我可以问一下您将如何对它们进行排序吗？@0x90，这个名称有点误导-jQuery sortable意味着您可以将项目拖放到新的顺序中。因此我假设OP的意思是，您抓取
1
并将其拖到
3
下面（导致Div2 Div3 Div1），应用程序会自动重新排列
div_容器中的内容（分为div 2项、div 3项、div 1项）这非常好，非常感谢-代码和指南！正是我要找的..谢谢！非常好，非常感谢-代码和指南！正是我要找的..谢谢！
<ul id="sortable">
   <li id="1">Div 1</li>
   <li id="2">Div 2</li>
   <li id="3">Div 3</li>
</ul>

<div id="div_container">
  <div id="div1">Div 1 item</div>
  <div id="div2">Div 2 item</div>
  <div id="div3">Div 3 item</div>
</div>

$('#sortable').sortable();

var indexBefore = -1;

function getIndex(itm, list) {
    var i;
    for (i = 0; i < list.length; i++) {
        if (itm[0] === list[i]) break;
    }
    return i >= list.length ? -1 : i;
}

$('#sortable').sortable({
    start: function(event, ui) {
        indexBefore = getIndex(ui.item, $('#sortable li'));
    },
   stop: function(event, ui) {
       var indexAfter = getIndex(ui.item,$("#sortable li")); 
       if (indexBefore==indexAfter) return;
       if (indexBefore<indexAfter) {
           $($("#div_container div")[indexBefore]).insertAfter(
               $($("#div_container div")[indexAfter]));
       }
       else {
           $($("#div_container div")[indexBefore]).insertBefore(
               $($("#div_container div")[indexAfter]));
       }
   }
});