0

私のウェブサイトには id のナビゲーションがあり#navます。クリックしたナビゲーション リストに基づいてタブバーをアクティブにしたい。ナビゲーション#navには次のような html があります:-

 <ul id ="nav">
    <li><a href="#tab1">Fred</a></li>
    <li><a href="#tab2">Thom</a></li>
    <li><a href="#tab3">Kay</a></li>
</ul>

Fred がナビゲーションからクリックされたとき、このような html を持つ tabber でこれを有効にしたい

 <ul class="tabs">                                        
         <li><a href="#tab1">Fred</a></li>                                      
         <li><a href="#tab2">Thom</a></li>    
         <li><a href="#tab3">Kay</a></li>       
</ul>

そして、このようなタブの内容:-

<div id="tab1" class="tab_content">Lorem</div>
<div id="tab2" class="tab_content">Ipsum</div>
<div id="tab3" class="tab_content">Dolor</div>

だから私はjqueryの次の行を書きました

$("#nav li").click(function() {

         var hash = location.hash;
          var sel = $("ul.tabs li a[href='" + hash + "'], ul#tabs li a[href='" + hash + "']");

    if (sel.length) { 

        sel.addClass("active").parent().addClass("active"); //Activate tab



        $(hash).show();
    }

うまくいきません！そして、どうすればonclickイベントをそれにバインドできますか? 申し訳ありませんが、私はjqueryにかなり慣れていません。このサイトで、使用しようとすると機能しない以前の例を見てきました。それで、誰かが私のコードを適応させてくれますか/助けてください。

4

1 に答える 1

1

あなたの jquery は問題ではありません - それはあなたの HTML です。クリック機能で location.hash を使用していますが、ナビゲーションには実際にはハッシュがありません。これを変更してみてください：

<ul id ="nav">
    <li><a href="tab1">Fred</a></li>
    <li><a href="tab2">Thom</a></li>
    <li><a href="tab3">Kay</a></li>
</ul>

これに：

<ul id ="nav">
    <li><a href="#tab1">Fred</a></li>
    <li><a href="#tab2">Thom</a></li>
    <li><a href="#tab3">Kay</a></li>
</ul>
于 2013-04-23T20:51:23.683 に答える