0

私はドロップダウンメニューを作成しており、リスト項目の画像をプラス(開いていないとき)からマイナス(開いているとき)に変更しようとしています。

最初の Tier (親リスト項目) はに設定されてlist-style:none;いるため、.click()以下を実行すると.addClass('close');、親を除くすべてに適用する必要があります<li>...

問題は、包含.click()関数で使用されるセレクターに親リスト項目が含まれていることです。

私がする必要があるのは言うことです：

「クラス 'close' を $(this) EXCEPT EXCEPT 最初の (親) <li>'s' に適用する」

jQuery は次のとおりです。

$(document).ready(function(){

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

    // My attempt (not working)...
    $(this).not("#nav > ul > li").addClass('close');

    event.stopPropagation();
    $(this).children("ul").slideToggle(100);

    $(".last, a").click(function(event){
      event.stopPropagation();
    });

  });

});

そしてjsFiddle :

クリックして表示

だから私の試みは次のとおりでした：

$(this).not("#nav > ul > li").addClass('close');

それはうまくいきませんでした...誰かアドバイスがあれば、大歓迎です! ありがとう ：）

アップデート：

クラス「close」!importantを追加する必要がありました。jQuery は本来あるべきことを行っていました。メニュー項目を閉じてクラスを正常に削除したら、回答を投稿します。

更新 (2):

!importantクラス仕様を削除し、 に変更しました#nav li.close。ありがとうアデネオ！

更新 (3):

.addClass()に変更.toggleClass()。このメニューは私が望んでいたことをするようです :) Sushanth さん、この提案に感謝します!

4

2 に答える 2

3

あなたの問題は、css セレクターでは十分に具体的ではありません。

usingは、問題の使用を修正するために(!important ではありません)#nav liよりも具体的です:.close#nav li.close

#nav li.close {
    list-style-image:url(http://www.horsepowerfreaks.com/images/close.gif);
}

フィドル

CSS の特異性と継承についてもう少し詳しく説明します。

于 2012-11-06T21:09:01.647 に答える
2

使用する.toggleClass()

$(this).not("#nav > ul > li").toggleClass('close');

コード内の他の場所にクラスを追加/削除していないと仮定します

于 2012-11-06T21:06:53.263 に答える