17

クラスがdiv内に存在するかどうかを確認しようとしています。しかし、それは常に長さ0になります。これが私のコードです:-

<div id="accordion2" class="accordion" >
  <div class="accordion-group">
    <div class="accordion-heading"> <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
        <div class="align-nav arrow-active">OSTOMY PRODUCTS</div></a>
    </div>
    <div id="collapseOne" class="accordion-body in collapse">
        <div class="accordion-inner">
            <ul>
                <li><a href="#">Professional Resources</a></li>
                <li><a href="#">One-piece Pouching</a></li>
            </ul>
        </div>
    </div>
  </div>
  <div class="accordion-group">
    <div class="accordion-heading"> <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
        <div class="align-nav arrow-inactive">LEARNING CENTER</div>
    </a> </div>
    <div id="collapseTwo" class="accordion-body collapse">
        <div class="accordion-inner">
            <ul>
                 <li><a href="#">Videos</a></li>
                 <li><a href="#">Before Your Surgery</a></li>
            </ul>
        </div>
    </div>
  </div>
  <div class="accordion-group">
    <div class="accordion-heading"> <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseThree">
      <div class="align-nav">PROFESSIONAL RESOURCES </div>
    </a> </div>
  </div>
  <div class="accordion-group">
    <div class="accordion-heading"> <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseThree">
           <div class="align-nav">PROFESSIONAL RESOURCES </div>
    </a> </div>
  </div>
</div>

最初の 2 div $(this).find('accordion-body').length は 1 である必要がありますが、それでも 0 が表示されます。私の Jquery コードは次のとおりです:-

$('.accordion-heading').click(function() {
            if($(this).find('accordion-body').exist()) {
                alert('hi');
                if($(this).find('.collapsed').length > 0) {
                    alert('hi');
                    //$(this).find('.accordion-toggle .align-nav').removeClass('arrow-active').addClass('arrow-inactive');  
                }
                else {
                    alert('hi');
                    //$(this).find('.accordion-toggle .align-nav').removeClass('arrow-inactive').addClass('arrow-active');
                }
            }
        });

$(this).find('accordion-body').length = 1; を取得する必要があります。ソリューションを提供してください。

4

4 に答える 4

38

クラスを検索しているため、クラスセレクターを選択する必要がありますfind..およびアコーディオンボディは親の子孫の使用であるためparent()

これを試して

$(this).parent().find('.accordion-body').length == 1;

またはあなたが使用することができますhasClass()

于 2013-03-29T05:53:34.173 に答える
1

それはそうです'.accordion-body'（ピリオドは重要です-それはクラスセレクターです）。

また.exist()、jQuery メソッドではありませんが、どこかで定義したと仮定します。

于 2013-03-29T05:52:40.717 に答える
0

これを試してください：

.accordion-body子供ではなく兄弟であるため、子供ではなく兄弟を見つける必要があります.accordion-heading。

    $('.accordion-heading').click(function() {
        if($(this).siblings('.accordion-body').length > 0) {
            alert('hi');
            if($(this).siblings('.collapsed').length > 0) {
                alert('hi');
                //$(this).find('.accordion-toggle .align-nav').removeClass('arrow-active').addClass('arrow-inactive');  
            }
            else {
                alert('hi');
                //$(this).find('.accordion-toggle .align-nav').removeClass('arrow-inactive').addClass('arrow-active');
            }
        }
    });

コードに問題がありました:

  1. .exist()要素をチェックする有効な方法ではありません
  2. $(this).find()これにより、子供が同じレベルの兄弟ではないことがわかります
于 2013-03-29T06:04:07.053 に答える
0

間違ったコンテキストでトラバースしています。また、最新のjQueryと .onメソッドで試してください

 $('#accordion2').on('click','.accordion-heading', function() {
        var accordionBodyLength = $(this).parent();
        var $accordBody = $('.accordion-body');
        alert(accordionBodyLength.find($accordBody).length);
  });

Working DEMO

于 2013-03-29T06:09:55.187 に答える