1

わかりました、どういうわけか私はこれを機能させる方法を理解できません。それほど難しいことではありません.

私は次のような普通の古いナビゲーションを持っています:

<ul>
        <li><a href="#" class="men-trigger">Men's</a></li>
        <li><a href="#" class="women-trigger">Women's</a></li>
        <li><a href="#" class="coed-trigger">Coed</a></li>
        <li><a href="#" class="all-trigger">All</a></li>
</ul>

そして、クリックした要素にクラスを追加する必要があります (方法はわかっています)。

$('.men-trigger').click(function() {  
   $(this).addClass('active');   
});

私が問題を抱えているのはactive、別のナビゲーション項目がクリックされたときにナビゲーション項目からクラスを削除する方法です。

私は次のようなことを試しましたが、うまくいきません：

$('.men-trigger').click(function() {  
    $(this).addClass('active');
    $(this).prev().siblings().find('active').removeClass('active');
});

を使用してみましたが.parent().siblings().children();、.parents(ul).find('active');まだ機能させることができませんでした。

これのデモを作成しました。

注: 各 nav 要素には独自のクラスが必要です。これは、スクリプトで別のことを行っているためです。ここでは、私が抱えている問題を示しているだけです。

これについて何か助けてくれてありがとう。

4

4 に答える 4

8 
$('.men-trigger').click(function() {  
    $(this).addClass('active').siblings().removeClass('active');
});

また、これらすべての関数を「ends-with」セレクターで結合できます。

$('[class$="trigger"]').click(function() {  
    $(this).addClass('active').siblings().removeClass('active');
});

そして、それらはli内のネストされたアンカーであるため、おそらく次のことを行う必要があります。

$('[class$="trigger"]').on('click', function() {  
    $(this).addClass('active').parent('li').siblings().find('a').removeClass('active');
});​

on()これは、jQuery 1.7以降を使用している場合に、イベントハンドラーをバインドするための推奨される方法としても追加されます

フィドル

于 2012-11-30T15:55:15.160 に答える
1

親要素を見つけるために最も近いものを使用できます。そして、あなたの発見には「。」がありませんでした。アクティブになる前に。

$('.men-trigger').click(function() {  
    $(this).closest('ul').find('.active').removeClass('active');
    $(this).addClass('active');
});
于 2012-11-30T15:58:29.700 に答える
1 
$('li').click(function(){
    $(this).children('a').addClass('active');
    $(this).siblings().children('a').removeClass('active');    
});​
于 2012-11-30T15:58:36.997 に答える
1 
$('.men-trigger').click(function() {  
    $('.active').removeClass('active');
    $(this).addClass('active');
});

nav要素に対してのみアクティブなクラスを使用していると仮定します

于 2012-11-30T15:56:20.450 に答える