0

ソート可能なリストの最初の項目のdiv--"small_box"を常に表示しないようにしたい。jquery first()を試してみましたが、ドラッグされたときは常に1つの同じ要素に対してのみ機能します。最初の場所以外にドラッグして、最初にジャンプするアイテムの「small_box」を非表示にしたときに、簡単に元に戻して表示するにはどうすればよいですか?

ライブの例をここに置きます:http://jsfiddle.net/kriskasper/3knnn/

<ul id="sortable" class='connectedSortable'>
<li>
    <div class="small_box">small box</div>     
    <div class="big_box">big box</div>
</li>        
<li>
    <div class="small_box">small box</div>     
    <div class="big_box">big box</div>
</li>        
<li>
    <div class="small_box">small box</div>     
    <div class="big_box">big box</div>
</li>

<li>
    <div class="small_box">small box</div>     
    <div class="big_box">big box</div>
</li>       
</ul>

そしてここにjqueryui関数があります:

    $(function() {
    $( "#sortable" ).sortable({
        connectWith: ".connectedSortable",
        placeholder: "ui-state-highlight",
        forcePlaceholderSize: true,
        opacity: 0.6,
        revert: 70

    });
});

助けてください。

4

1 に答える 1

0

ソート可能なプラグインイベントで遊ぶ必要があります。sortreceiveイベントは、接続された要素がアイテムを受信したときに発生します。私の推測は次のようなものになるでしょう...

$("#sortable").bind("sortreceive", function(event, ui) {
    $(".connectedSortable .small_box").show();
    $("#sortable .small_box").first().hide();
});
于 2012-09-23T12:20:28.400 に答える