1

次のメニューを取得しました。

   <ul id="nav" class="nav">
    <li>
     <a class="navitem active" href="javascript:loadTab();">My Profile </a>
    </li>
    <li>
     <a class="navitem search" href="javascript:loadTab();"> Search </a>
    </li>
    <li>
     <a class="navitem" href="javascript:loadTab();">Favorites </a>
    </li>
   </ul>

そして私の関数（ヘッダーの.jsファイルにロードされます）：

function loadTab() {
    jQuery(".navitem").removeClass("active");
       jQuery(".navitem").click(function () {
          jQuery(this).addClass("active");
       });
}

クラス「アクティブ」を削除すると機能しますが、クリックした要素にクラス「アクティブ」を追加しても機能しません。何か案は？

よろしくお願いします！

4

2 に答える 2

2

thatidiotguy が言ったように、間違った場所でクラスを削除しています。次のようなものが必要です。

jQuery(".navitem").click(function (event) {
    event.preventDefault();

    jQuery(".navitem").removeClass("active");
    jQuery(this).addClass("active");
});

編集：また、タグに は必要ありませjavascript:loadTab();んa。hrefそれらの属性を#次のように変更します。

<ul id="nav" class="nav">
    <li>
        <a class="navitem active" href="#">My Profile </a>
    </li>
    <li>
        <a class="navitem search" href="#"> Search </a>
    </li>
    <li>
        <a class="navitem" href="#">Favorites </a>
    </li>
</ul>

また、リンクのイベント ハンドラーを追加event.preventDefault();しました。click

于 2012-11-02T15:20:34.490 に答える
0

これは、タブをクリックするたびにクラスが削除されるためです。次に、タブがクリックされたときに loadTab を呼び出すようにタブに指示します。これにより、もう一度クラスが削除されます。Think Inception 「夢の中の夢」

于 2012-11-02T15:18:15.450 に答える