jqueryを使用したtoggleClass

Question

リンクに特定のクラスがあるかどうかに基づいて、リンクを使用して配置されたスパンでクラスをスワップする必要があります。これを試しましたが、うまくいかないようです。私は何が欠けていますか？

if ($("#myLink").hasClass("dis")) { 
    $("#myLink").find("span").toggleClass("uico", "uicoGR"); 
} else { 
    $("#myLink").find("span").toggleClass("uicoGR", "uico"); 
} 

<a href="#" id="myLink" class="dis"><span class="uico"></span></a> 

Answer 1

スペースで区切られた、最初のパラメータに渡されるべきでトグルされる2つのクラス名は。

また、hasClass()という条件をセレクタに追加することもできます。

$('.dis#mylink span').toggleClass('uico uicoGR') ; 

編集

再質問を読むと、それはあなたがtoggleClass()が何を感謝していることは明らかではありません。この関数は、指定されたすべてのクラスを探し、見つからない場合は追加するか、そうでない場合はクラスを削除します。あなたがしているのは、3番目のクラスが見つかったかどうかに基づいてクラスを追加または削除するように見えるでしょう。このために、ちょうどaddClass()とremoveClass()を使用する：あなたはデュアルクラスメソッドを使用して主張する場合

$('#mylink').each(function() { 
    if($(this).hasClass('dis')) { 
    $(this).find('span').addClass('uicoGR').removeClass('uico') ; 
    } else { 
    $(this).find('span').addClass('uico').removeClass('uicoGR') ; 
    } 
}) ; 

Answer 2

クラスは、スペースで区切られた、単一の文字列パラメータに渡さなければならない例えば：

$("#myLink").find("span").toggleClass("uico uicoGR"); 

Answer 3

、その後のGusはここに正しい答えを持っていますが、私はあなたがすべてで、このコードが必要かどうかを挑戦します。これらのクラスがCSSに使用されている場合は、uicoGRまたはuicoを追加/削除せずにCSSセレクタの2つの状態を識別するための十分な情報がすでにあるため、このjavascriptは必要ありません。

最初の状態は（あなたが.uicoGRを使用していたもの）は、このCSSセレクタです：

#mylink span {put your CSS here} 

第二の状態は、（あなたが.uico使用していたもの）は、このCSSセレクタです：

#mylink.dis span {put your CSS here} 

クラス "dis"が存在する場合、2番目の状態は最初の状態のCSSを上書きします。