2011-11-25 5 views
32

ul-listにクラスを追加したいが、クラスが存在しない場合にのみ追加する。 これは私がこれまで持っているものです。クラスがulタグに存在する場合、jqueryでどのようにチェックするのですか?jqueryを介してクラスを追加するが、存在しない場合のみ

$("ul").addClass("bbox"); 
+10

の現在の設定を確認する必要はありませんクラスが持っているかどうかを確認する必要はありませんすでに追加されています。 '.addClass'は' .hasClass'チェックを内部的に行います。参照:http://stackoverflow.com/questions/13358887 –

答えて

34

特定のクラスは、その後、存在する場合は、チェックしたい場合:

if(!$("ul").hasClass("class-name")){ 
    $("ul").addClass("bbox"); 
} 

任意のクラスが存在するかどうかをチェックしたい場合は、次の簡潔

if ($('ul').attr('class') == '') { 
    $("ul").addClass("bbox"); 
} 
+0

#contentの最初のulを選択しようとしましたが、すべてを選択しています。なにが問題ですか? hasClass( "bbox")== false){ $( "ul")。 } – mark

+2

'hasClass()'はすでにtrueまたはfalseを返しているので、falseに等しいかどうかのチェックは冗長です。 'if(!$( 'ul')。hasClass( 'classname'))'は – Andy

+0

で十分です@Andy True、答えが修正されました。 –

3

// fine, because nothing happens if 
// there are no matching elements 
$("ul[class='']").addClass("bbox"); 
+0

素敵で短いです! – lucapette

+0

クラスにaboxがあり、bboxを追加しようとしていると動作しません。 Mattのソリューションはこの問題を解決します。 –

16

karim79あなたはほとんどそれを手に入れました!

は、私はあなたが絶対無いクラスとタグと一致し、ULが他のクラスを持っていた場合はマッチングが行われることはないあなたに

$("ul:not([class*='bbox'])").addClass("bbox"); 

を修正してみましょう。追加したいクラスを正確に検索する必要があります。 .hasClassと同じように。

はそれが私はこれが正常に動作します思っていた

+2

もし私が間違っていないなら、あなたは属性セレクターのまわりを括弧で忘れてしまった。また、 '$(" ul:not([class = = 'bbox']) ")。addClass(" bbox ");'は良い(チルダ)でしょう。 – Bart

11

を役に立てば幸い - >

$("ul").removeClass("bbox").addClass("bbox")

まず、あるものがあれば削除し、新しいものを追加します。私はあまりにも怠けているので、すべての入力をifと言って私のために最善を尽くした。

3

あなたは

$('.your-dom:not(.class-name)').addClass('class-name'); 
8

存在しない場合だけ$('.selector').addClass("myClass");を使用する場合にのみ、クラスを追加するために、このコードを使用することができます。

jQueryのadd/removeクラス関数は、内部的に重複をチェックします。つまり、addClassを2回呼び出すと、クラスが1回追加されます。

+0

jQueryドキュメント:https://api.jquery.com/addclass/このメソッドはクラスを置き換えるものではありません。要素を既に割り当てられているクラスに追加するだけで、クラスを追加するだけです。 – vanduc1102

0

私はこの方法を使用する2つのクラス

if (foo) 
    $('button.btn-foo').removeClass('foo bar').addClass('foo'); 
if (bar) 
    $('button.btn-foo').removeClass('foo bar').addClass('bar'); 

の間でトグルしていた場合はだから私はボタン

関連する問題