-1

3 セットのタブをセットアップし、並べ替え可能にしました。また、sortable の connectedLists オプションを介してそれらを接続しました。タブをあるリストから別のリストに移動するとき、タブ + ターゲット div を新しいコンテキストに移動します。現在、移動したタブをクリックすると、ターゲットがまだ古いスペースにあることが予想されます。しかし、主な問題は、以前のタブセットの一部として引き続き機能することです。この動作を変更したいと思います。

<div id="tabs-1"><ul class="gadget-tabs">...</ul></div>
<div id="tabs-2"><ul class="gadget-tabs">...</ul></div> 
<div id="tabs-3"><ul class="gadget-tabs">...</ul></div>
<script>
$('div[id^=tabs-]').tabs();
$('.gadget-tabs').sortable({
        connectWith: ".gadget-tabs"
}).disableSelection();
</script>

すべてのタブが ajax でロードされていることに注意してください。

4

1 に答える 1

0

次の回避策は、ほとんどの場合に問題なく機能しますが、いくつかのテストでは依然としてUncaught jQuery UI Tabs: Mismatching fragment identifier.例外がスローされます。なぜこの一貫性のない動作なのか疑問に思います!

また、わずかな揺れがありますが、タイムアウト値を減らすことで軽減できます。

<div id="tabs-1"><ul class="gadget-tabs">...</ul></div>
<div id="tabs-2"><ul class="gadget-tabs">...</ul></div> 
<div id="tabs-3"><ul class="gadget-tabs">...</ul></div>
<script>
$('div[id^=tabs-]').tabs();
$('.gadget-tabs').sortable({
        connectWith: ".gadget-tabs",
        receive: function (event, ui) {
            var receiver = $(this).parent();
            var sender = $(ui.sender[0]).parent();
            receiver.tabs('destroy');
            sender.tabs('destroy');
            setTimeout(function () { receiver.tabs(); sender.tabs()}, 100);
        }
}).disableSelection();
</script>
于 2012-06-12T06:52:16.823 に答える