javascript - 遍历每个兄弟元素

Question

上下文： 我正在构建一个表单和脚本，它将基于单击特定按钮执行 ajax 查询。有多个具有相同类元素的 div 块，并且根据其中的 div 块，单击一个按钮，将处理不同的表单。

作为开始程序的一部分，我从一个看似简单的 jQuery 调用开始。

我正在尝试将 onclick 事件添加到特定类，然后尝试获取该元素的兄弟姐妹的 CSS 值。

错误： 我收到一条错误消息，指出TypeError: this.siblings is undefined.

问题：使用 jQuery 迭代元素的兄弟姐妹的正确方法是什么？

我的代码：

HTML：

<a class="btn LiveStatsBtn"><span class="btn-label">Get Stats now</span> </a>

JavaScript：

$(document).ready (function()
{ 
    $('.LiveStatsBtn').click(function(){
        this.siblings.each( function () {
            var tx=this.css();
            alert(tx);
        });
    });
});

Answer 1

在 jQuery 事件处理程序中，this指的是 DOM 元素，而不是 jQuery 对象。你必须把它包装成一个：

$(this).siblings().each(function() {
  // ...
});

另请注意，“siblings”是一个函数，因此您必须调用它来获取包装元素兄弟的新 jQuery 对象。

Answer 2

siblings是一个函数，所以它需要括号：

$(document).ready (function()
{ 
    $('.LiveStatsBtn').click(function(){
        $(this).siblings().each( function () {
            var tx=$(this).css();
            alert(tx);
        });
    });
}); 

http://api.jquery.com/siblings/