1

我有一个选项卡式可排序列表系统。但是,我无法限制可以拖入哪个选项卡的内容。

我现在的 javascript 是这样的

<script>
    $(function() {
        $( "#sortable1, #sortable2, #sortable_end" ).sortable().disableSelection();

        var $tabs = $( "#tabs" ).tabs();

        var $tab_items = $( "ul:first li", $tabs ).droppable({
            accept: ".connectedSortable li",
            hoverClass: "ui-state-hover",
            drop: function( event, ui ) {
                var $item = $( this );
                var $list = $( $item.find( "a" ).attr( "href" ) )
                    .find( ".connectedSortable" );

                ui.draggable.hide( "slow", function() {
                    $tabs.tabs( "select", $tab_items.index( $item ) );
                    $( this ).appendTo( $list ).show( "slow" );
                });
            }
        });
    });
    </script>

和我的html

<div id="tabs">
    <ul>
        <li><a href="#Models">Make</a></li>
        <li><a href="#Minutes">Minutes</a></li>
        <li><a href="#Final">Final</a></li>
    </ul>
</div>

    <div id="Models">
            <ul id="sortable1" class="connectedSortable ui-helper-reset">
            <li id="item_=1"><div>nokia lumia 800</div></li><li id="item_=2"><div>Apple iPhone 4s</div></li><li id="item_=3"><div>Samsung Galaxy S2</div></li><li id="item_=4"><div>Blackberry Bold 9900</div></li><li id="item_=5"><div>HTC Sensation XE</div></li><li id="item_=6"><div>Sony Ericsson Xperia Arc S</div></li>     </ul>
        </div>

        <div id="Minutes">
            <ul id="sortable2" class="connectedSortable ui-helper-reset">


  <li id="item_=13"><div>100</div></li><li id="item_=14"><div>200</div></li><li id="item_=15"><div>500</div></li><li id="item_=16"><div>700</div></li><li id="item_=17"><div>1000</div></li><li id="item_=18"><div>2000</div></li><li id="item_=19"><div>3000</div></li><li id="item_=27"><div>Unlimited</div></li>     </ul>
        </div>

        <div id="Final">
            <ul id="sortable_end" class="connectedSortable ui-helper-reset">            
        </div>

我可以将模型中的东西拖到几分钟内,我想限制它,所以只有东西可以拖到 final 中。并且最好只有两个选项卡中的一项。

多谢你们

4

0 回答 0