JQuery排序不會溢出列表項

Question

我有兩個列表 - 第一個包含用戶可以選擇的項目列表，他通過將它們拖到第二個列表中選擇它們。我用jQuery UI Sortable實現了這一點，並在jsfiddle上創建了一個基本示例。

因此，將項目從第一個列表拖到第二個列表 - 確定。如果向下滾動到第二個列表的底部，則會出現問題 - 您無法將項目從第一個列表拖到第二個列表。看起來超出可見列表末尾溢出的所有列表項目都沒有與它們關聯的放置目標。在另一個方向上覆制時也是如此。由於排序似乎是針對列表，我懷疑我錯過了一個竅門。有任何想法嗎？

的的jsfiddle示例代碼是：

HTML

<div class="listDiv"> 
    <ul id="list1" class="connected ui-sortable"> 
     <li id="a">a</li> 
     <li id="b">b</li> 
     <li id="c">c</li> 
     <li id="d">d</li> 
     <li id="e">e</li> 
     <li id="f">f</li> 
     <li id="g">g</li> 
     <li id="h">h</li> 
     <li id="i">i</li> 
     <li id="j">j</li> 
    </ul> 
</div> 
<div class="listDiv"> 
    <ul id="list1" class="connected ui-sortable"> 
     <li id="1">1</li> 
     <li id="2">2</li> 
     <li id="3">3</li> 
     <li id="4">4</li> 
     <li id="5">5</li> 
     <li id="6">6</li> 
     <li id="7">7</li> 
     <li id="8">8</li> 
     <li id="9">9</li> 
     <li id="10">10</li> 
     <li id="11">11</li> 
     <li id="12">12</li> 
     <li id="13">13</li> 
     <li id="14">14</li> 
     <li id="15">15</li> 
    </ul> 
</div> 

JS

$(function() { 
    $("#list1, #list2").sortable({ 
     connectWith: ".connected" 
    }).disableSelection(); 
}); 

CSS

.listDiv { 
    overflow:auto; 
    float: left; 
    width:400px; 
    border: 1px solid #999; 
} 

#list1, #list2 { 
    list-style-type: none; 
    height: 200px; 
} 

#list1 li, #list2 li { 
    font-size: 11px; 
    margin: 0 5px 5px; 
    padding: 5px; 
    width: 300px; 
    border: 1px solid #C5DBEC; 
    font-family: Verdana,Arial,Helvetica,sans-serif; 
    font-weight: bold; 
    outline: medium none; 
}​ 

Answer 1

我相信我已經確定了jquery ui的排序版本，其中引入了bug - 1.8.12。下面的代碼似乎會導致錯誤：

//We ignore calculating positions of all connected containers when we're not over them if(item.instance != this.currentContainer && this.currentContainer && item.item[0] != this.currentItem[0]) continue;

我在希望他們將重新討論這一（不固定）的bug，並在以後的版本中修復這個報道對jQuery UI的錯誤4231。

所以如果你正在努力解決這個問題，你可以檢查bug是否已經修復，或者恢復到jquery ui 1.8.11，或者刪除上面提到的違規代碼，並希望最好！