jquery-ui連接可排序：如何隱藏/顯示第一項？

Question

我有這樣的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 3</li> 
    <li class="ui-state-default">Item 4</li> 
    <li class="ui-state-default">Item 5</li> 
</ul> 

<ul id="sortable2" class="connectedSortable"> 
    <li class="ui-state-highlight">Drop item here</li> 
</ul> 

當至少一個項目是從＃sortable1降至＃sortable2，我想補充類 「隱藏」 到：

<li class="ui-state-highlight">Drop item here</li> 

剛爲...隱藏它，因爲這個「佔位」現在是無用的，所以就變成：

<ul id="sortable2" class="connectedSortable"> 
    <li class="ui-state-highlight hide">Drop item here</li> 
</ul> 

然後，如果所有項目都來自＃sortable2跌回＃sortable1，類hide應該再次移除，以顯示「佔位符」返回

任何想法，請？謝謝！

Answer 1

好，我知道......

<ul id="sortable2" class="connectedSortable"> 
    <li class="ui-state-highlight placeholder">Drop item here</li> 
</ul> 

... 

$('#sortable2').sortable({ 
    items: 'li:not(.placeholder)', 
    connectWith: '.connectedSortable', 
    update: function(){ 
     var placeholder = $(this).children('.placeholder'); 
     ($(this).children().length > 1) ? placeholder.hide() : placeholder.show(); 
    } 
}).disableSelection();