拖放和可排序的jQuery插件之间的冲突

当我尝试混合这些插件时，我有一个冲突，我在一些演示中基于我的脚本。问题是，当我拖动同一列表内的东西，它会触发拖放事件，并将该项目添加到列表的末尾，如果该项目被放入另一个列表中，但不是相同，当我将它放在同一个列表，我想将其插入到那个位置（它的工作原理，如果我禁用下降事件）拖放和可排序的jQuery插件之间的冲突

JS代码：

$(document).ready(function() { 
     $("#sortlist1").treeview(); 
     $("#sortlist1").droppable({ 
     accept: ".item", 
     drop: function(ev, ui) { 
      alert(ui.sender) 
      $("#sortlist1").append($(ui.draggable));  
     } 
     }); 
     $("#sortlist2").droppable({ 
      accept: ".item", 
      drop: function(ev, ui) { 
       $("#sortlist2").append($(ui.draggable)); 
      } 
      }); 
     $("#sortlist3").droppable({ 
      accept: ".item", 
      drop: function(ev, ui) { 
       $("#sortlist3").append($(ui.draggable)); 
      } 
      }); 
     $('.sortlist').sortable({ 
      handle : '.icono', 
      update : function() { 
       $('input#sortlist').val($('.sortlist').sortable('serialize')); 
      } 
     }); 
    });

和HTML：

<ul class="sortlist treeview lista" id="sortlist1"> 
     <li id="listItem_1" class="expandable closed item"> 
      <div class="hitarea closed-hitarea expandable-hitarea lastExpandable-hitarea"> 
       <img src="img/arrow_out.png" class="icono" alt="move" /> 
      </div> 
      numero 1<input type="checkbox" /> 
      <ul class="sortlist" id="sublist"> 
       <li id="sublistItem_1"><img src="img/arrow_out.png" class="icono" alt="move" />numero 1<input type="checkbox" /></li> 
       <li id="sublistItem_2"><img src="img/arrow_out.png" class="icono" alt="move" />numero 2<input type="checkbox" /></li> 
      </ul> 
     </li> 
     <li id="listItem_2" class="item"><img src="img/arrow_out.png" class="icono" alt="move" />numero 2<input type="checkbox" /></li> 
     <li id="listItem_3" class="item"><img src="img/arrow_out.png" class="icono" alt="move" />numero 3<input type="checkbox" /></li> 
     <li id="listItem_4" class="item"><img src="img/arrow_out.png" class="icono" alt="move" />numero 4<input type="checkbox" /></li> 
     <li id="listItem_5" class="item"><img src="img/arrow_out.png" class="icono" alt="move" />numero 5<input type="checkbox" /></li> 
     <li id="listItem_6" class="item"><img src="img/arrow_out.png" class="icono" alt="move" />numero 6<input type="checkbox" /></li> 
     <li id="listItem_7" class="item"><img src="img/arrow_out.png" class="icono" alt="move" />numero 7<input type="checkbox" /></li> 
     <li id="listItem_8" class="item"><img src="img/arrow_out.png" class="icono" alt="move" />numero 8<input type="checkbox" /></li> 
     <li id="listItem_9" class="item"><img src="img/arrow_out.png" class="icono" alt="move" />numero 9<input type="checkbox" /></li> 
     <li id="listItem_10" class="item"><img src="img/arrow_out.png" class="icono" alt="move" />numero 10<input type="checkbox" /></li> 
     <li id="listItem_11" class="item"><img src="img/arrow_out.png" class="icono" alt="move" />numero 11<input type="checkbox" /></li> 
    </ul> 
    <ul class="sortlist treeview lista" id="sortlist2"> 
    </ul> 
    <ul class="sortlist treeview lista" id="sortlist3"> 
    </ul>

来源

2008-12-17 Juan Techera