2

jqueryを使用して兄弟の要素を取得しているときに、いくつかの問題に直面しています。説明してみます。

以下は私が現在取り組んでいるHTMLです..

<p class="paraclass1" id="amazing1">
  <span class ="pascal1">
    <div class='pascal'>
        <INPUT id= "chk1" value="on" type="checkbox" />
    </div>
  </span>
</p>
<p>
  <label class='lblclass'>this is a label </>
</p>

私がやりたいことは、2 番目の p タグに存在するすべての子をナビゲートして見つけることです (現在はラベルのみが存在します)。以下は、私が取り組んでいるJqueryコードです..

$('#chk1').click(function(){
  alert($(this).parents('p#amazing1').next().children().length)

 // alert($('#chk1').parent().parent().attr('class'));
});

http://jsfiddle.net/gj1118/vWQxD/5/

どんな助けでも大歓迎です。

ありがとう

編集 私は今、2 番目の p タグ要素内にあるラベルのテキストを取得しようとしていますが、機能していません..何か不足していますか? フィドルはまだ変えていませんが、見本であり、タグも使用していなかったので、簡単のためにそのままにしておきました

4

1 に答える 1

11

jQuery は正常に動作するはずです。この場合の問題は、マークアップです。このp要素には、「 phrasing content 」のみを含めることができます。このdiv要素はフレージング コンテンツとして分類されないため、ブラウザは物事を移動することによってマークアップを処理するために最善を尽くします。

Chrome は単純にp要素を移動して、div.

この問題を解決するには、マークアップを変更する必要があります。最善の策は、p要素を別の に変更することdivです。更新された fiddleを参照してください。


サイドノート.parents()通話を通話に変更することを検討して.closest()ください。.parents()セレクターに一致する場合、メソッドは複数の要素を返すことができます。この場合、それは不可能ですが、保守性のために、次のように変更することをお勧めします。

$(this).closest('#amazing1').next().children().length
于 2012-12-17T21:16:49.507 に答える