0

Jquery Ui タブ フレームワークを使用しています。選択したタブを、ブラウザの URL パターン (www.xyz.com/#tab1 や www.xyz.com/#tab2 など) に合わせて変更したいと考えています。

を使用して回避策を見つけました 

$("#tabs").bind('tabsselect', function(event, ui) {
                window.location.href=ui.tab;

ただし、タブアンカーを選択していますが、実際にはタブを変更していないため、実際にタブを変更するにはEnterキーを押す必要があります。URLパターンに従ってタブが変更されるように、誰かが私が間違っている場所を指摘し、変更を示唆することができますか.

これを実装するために次のコードを使用しています

 $(document).ready(function() {




   $( "#tabs" ).tabs({
         beforeLoad: function( event, ui )
          {        
          ui.jqXHR.error(function() { 
                   ui.panel.html(            "Couldn't load this tab. We'll try to fix this as soon as possible. "  ); 
                          }); 
                               }    
                               });

            $("#tabs").bind('tabsselect', function(event, ui) {
            window.location.href=ui.tab;

        });

 });

HTMLコード

<div id="tabs">
<ul>
    <li><strong class="first">
    <a href="#tabs1" id="tab1">Tab-1</a>
    </strong></li>
<li>
<strong>
<a href="xyz.do" id="tab2">Tab-2</a>
</strong>
</li>

</ul>

<div id="tabs1">
tab -1 content
</div>
4

1 に答える 1

0

activate ハンドラーを介してバインドすることをお勧めします。 http://api.jqueryui.com/tabs/#event-activate

$( ".selector" ).on( "tabsactivate", function( event, ui ) { changeColor(ui); } );

ui.tab には、クリックされたタブに関する詳細が含まれます。

あなたの場合、私はあなたが言いたいと思うと思います

    var changeColor(ui) = function(
    if (ui.index == 1) { 
       $("#selector").addClass("tab2Active"); 
    });
于 2013-03-22T10:26:48.743 に答える