4

以下のようなhtmlがあります。div(accordionContents) 内のすべての要素をループしています。ループ内で、要素 h2 が 2 つの css クラス (acc_trigger とアクティブ) を適用しているかどうかを確認する必要があります。どうすればよいですか?

 <div id="accordionContents">
     <div class="accordioncontainer">         
                    <h2 class="acc_trigger active">
                       <a href="#"> <img class="openImage" src="Images/closed.png"> 
                          <div class="openHeader">Division : <b>Quality Assurance</b>(4 items)</div></a></h2>
                    <div class="acc_container" style="display: block;">
                        <div class="dataRowTeam">
                            <div class="riskStartContent">
                                <div class="riskGridHeader">
                                    weekStart</div>
                            </div>
                            <div class="riskEndContent">
                                <div class="riskGridHeader">
                                    90%</div>
                            </div>
                        </div>
                    </div>

                </div>
                 <div class="accordioncontainer">


                    <h2 class="acc_trigger">
                       <a href="#"> <img class="openImage" src="Images/closed.png"> 
                        <div class="openHeader">Division : <b>Quality Assurance</b>(4 items)</div></a></h2>
                    <div class="acc_container" style="display: none;">
                        <div class="dataRowTeam">
                            <div class="riskStartContent">
                                <div class="riskGridHeader">
                                    weekStart</div>
                            </div>
                            <div class="riskEndContent">
                                <div class="riskGridHeader">
                                    90%</div>
                            </div>
                        </div>
                    </div>

                </div>
</div>
4

5 に答える 5

4

あなたの特定のケースでは、これで十分です:

var hasActive = $('.acc_trigger').hasClass("active"); // Bool. TRUE / FALSE

if(hasActive){
    // do something if TRUE
}

それ以外の場合は、要素の存在に直接行くことができます

$('.acc_trigger.active').css({background: 'red'});

LIVE DEMO

ところで、あなたの HTML の書式設定は非常に珍しいです。むしろ間違っていると思います: (ブロックレベルの要素) は(インライン) 要素
DIV内にあるはずがありませんA

于 2013-02-08T11:44:35.923 に答える
0

これを試して:

$('.accordionContents h2').each(function() {
    if ($(this).is('.acc_trigger.active')) {
        // do something...
    })
});
于 2013-02-08T11:43:06.300 に答える
0
var strValue = $("h2").prop('class').trim();
if(strValue.indexOf(" ") > -1)
{
    //This element has multiple classes.
}
else
{
    //This element has a single class.
}
于 2013-02-08T11:44:21.360 に答える
0

hasClass に複数回問い合わせてみてください ;)

$(".accordionContents").each(function(){
    var $headline = $("h2", this).first();
    var hasBothCSSClasses = $headline.hasClass('acc_trigger') & $headline.hasClass('active');
});
于 2013-02-08T11:34:43.977 に答える
0

これを試してください:http://jsfiddle.net/jH8RF/1/

var clslen = $('h2').attr('class').split(' ').join(',');
var len = clslen.indexOf(',');

if( len > 0){
     alert('elem has more than one class');
}else{
     alert('elem has just one class');
}
于 2013-02-08T11:42:46.853 に答える