Jquery获得下一个兄弟

问题描述：

我在使用jquery获取兄弟元素时遇到了一些问题。我会尽力解释。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标签元素内，其不工作....标签的文字是有，我失去了一些东西..？我还没有改变小提琴，但因为它只是一个样本，并且由于标签没有被使用，为了简单起见，我仍然保持它的样子。

当我改变了div来的跨度小提琴的工作：http://jsfiddle.net/vWQxD/6/- 大概是因为你不应该在跨度中包含div。还要注意''.closest（）'是比'.parents（）'更好的选择，因为你正在做的事情。 – nnnnnn

答

您的jQuery应该可以正常工作。这种情况下的问题是您的标记。 p element只能包含“phrasing content”。 div元素不会被分类为短语内容，因此浏览器将尽最大努力通过移动事物来处理您的标记。

Chrome只是移动p元素成为div的前兄弟。

要解决此问题，您需要更改标记。您最好的选择可能是将p元素更改为另一个div。请参阅updated fiddle。

旁注。您可能需要考虑将.parents()呼叫更改为.closest()呼叫。如果.parents()方法与选择器匹配，则可以返回多个元素。在这种情况下，这是不可能的，但在维护的利益，也可能是一个很好的变化：

$(this).closest('#amazing1').next().children().length

你可以看到浏览器如何在这里移动它：http://jsfiddle.net/vWQxD/7/ – nnnnnn

我认为只要它看到一个div标签就关闭p标签。 –

@SalmanA - 是的，这正是它所做的，用比我说的更好的方式说出来！ –

Jquery获得下一个兄弟

相关推荐