在jquery选择器中获取兄弟姐妹

Question

我想检测两个元素的点击：

1) class is called advancedTargeting
2) the sibling li of the li that has the `area` attribute.

例如第二次要求：

<li area style='display:block'>bla</li>
<li>123</li>
<li>356</li>

所以我想抓住李区兄弟的点击。在这个例子中，我想在li上点击他的文本：123。

<li area style='display:block'>bla</li>
<li>356</li>

（在本例中，点击356的li）..

他们应该运行相同的功能。

我认为应该做的事情如下：

$('.advancedTargeting, li[area]:next').live('click', function () {

});

Answer 1

这是siblings选择器，您需要。

$('.advancedTargeting, li[area] ~ li').live('click', function () {

});

Answer 2

$('.advancedTargeting, li[area] + li').on('click', function (){
  var number = $(this).text();
});

Answer 3

要选择具有li属性的area的第一个兄弟，只需使用siblings selector并结合:first selector：

$('.advancedTargeting li[area]').siblings().filter(":first")

添加点击功能：

$('.advancedTargeting li[area]').siblings().filter(':first').on('click',function(){
//code goes here...
})

的 jsfiddle demo 的

Answer 4

我建议：

$('li[area]').next().on('click', function (){
    // click handling here
});

虽然最好使用有效的html 5 data-*属性，而不是使用无效的自创属性。

顺便说一下，jQuery 1.7中不推荐使用live()（由on()替换），并在jQuery 1.9中删除;并且在jQuery中＆lt; = 1.7 delegate()建议在文档中更高效/更高效。

参考文献：

• next()。
• on()。

Answer 5

$('.advancedTargeting li[area]:next').live('click', function () {
...
});

或

$('.advancedTargeting li[area]:next').click(function () {
...
});