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>

我想做的是导航并找到第二个 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/

任何帮助,将不胜感激。

谢谢

编辑 我现在正在尝试获取第二个 p 标签元素内的标签文本,但它不起作用.. 有什么我遗漏的东西.. 吗?我还没有改变小提琴,但由于它只是一个示例并且由于没有使用标签,为了简单起见,我让它保持原样

4

1 回答 1

11

您的 jQuery 应该可以正常工作。在这种情况下,问题是您的标记。该p元素只能包含“短语内容”。该div元素不属于短语内容,因此浏览器将通过移动内容来尽力处理您的标记。

Chrome 只是将p元素移动为div.

要解决此问题,您需要更改标记。您最好的选择可能是将p元素更改为另一个div. 查看更新的小提琴


旁注。您可能要考虑将.parents()呼叫更改为.closest()呼叫。.parents()如果匹配选择器,该方法可以返回多个元素。在这种情况下这是不可能的,但为了可维护性,这可能是一个很好的改变:

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