列表中没有元素删除列表中的jQuery中

Question

我使用jQuery拖放显示功能here

HTML代码

<ul id="sortable1" class="connectedSortable"> 
    <li class="ui-state-default">Item 1</li> 
    <li class="ui-state-default">Item 2</li> 
    <li class="ui-state-default">Item 5</li> 
</ul> 
<ul id="sortable2" class="connectedSortable"> 
    <li class="ui-state-highlight">Item 1</li> 
    <li class="ui-state-highlight">Item 2</li> 
    <li class="ui-state-highlight">Item 3</li> 
</ul> 

JavaScript代码

$(function() { 
    $("#sortable1, #sortable2").sortable({ 
    connectWith: ".connectedSortable" 
    }).disableSelection(); 
}); 

我做小提琴here

这里一切都运行fi ne，但唯一不寻常的是，因为任何列表都是空的，所以它被删除或从DOM中删除，因为我们无法添加任何内容，我想这样做，我该怎么做，请一些启发。

由于提前， ANKUR

Answer 1

问题是因为空ul没有height或width捕捉拖动事件。设置以下CSS和它的作品：

.connectedSortable { 
    min-height: 50px; 
    min-width: 120px; 
} 

Example fiddle

Answer 2

CSS

#sortable1, #sortable2 { 
    list-style-type: none; 
    margin: 0; 
    padding: 0 0 2.5em; 
    float: left; 
    margin-right: 10px; 
    width:120px; // Add width HERE 
} 

JAVASCRIPT

$(function() { 
    $("#sortable1, #sortable2").sortable({ 
     connectWith: "ul" // Change that 
    }).disableSelection(); 
    }); 

我在你的小提琴手进行了测试和运行良好