Question

HTML code：

<table border='1' cellpadding='5'> 
    <tr>
        <td class="order"><a href="#">two</a></td>
        <td>demo</td>
        <td>last</td>
    </tr>
    <tr>
        <td>two</td>
        <td class="order"><a href="#">three two</a></td>
        <td>sample</td>
    </tr>
    <tr>
        <td>two</td>
        <td class="order"><a href="#">five two</a></td>
        <td>sample</td>
    </tr>
    <tr>
        <td>five</td>
        <td>quick</td>
        <td class="order"><a href="#">nine</a></td>
    </tr>
</table>

jQuery代码：

$('.order').click(function(){
var index = $(this).index();
    var text = $(".order:eq(index-1)").text();
    alert(text);
});

单击任何order类时，我想获得具有相同order类的上一个或下一个元素。我的代码有什么不对。

这是我的Fiddle

谢谢。

Answer 1

该代码存在两个问题：

首先，index的形式将告诉您元素相对于其兄弟的索引，而不是相对于具有相同类的其他元素。因此，对于您的HTML，它始终为1，因为您的所有.order元素都是其父级中的第二个子元素。
第二件事是这一行：
```
var text = $(".order:eq(index-1)").text();
```
...使用index 字面，它不会交换index变量的值。

您使用index走在正确的轨道上，但是，您只需使用a different form of it：

var orders = $(".order");
var index = orders.index(this);

然后，不是构建jQuery无法传递给浏览器的选择器（因为它使用jQuery特定的:eq选择器），而是使用eq 函数：

var text = orders.eq(index - 1).text();

但是你想要处理没有前一个元素的情况，也许：

var text = index > 0 ? orders.eq(index - 1).text() : "default text";

实例：

$('.order').click(function(){
    var orders = $(".order");
    var index = orders.index(this);
    var text = index > 0 ? orders.eq(index - 1).text() : "default text";
    alert(text);
    return false;
});

<table border='1' cellpadding='5'> 
    <tr>
        <td class="order"><a href="#">two</a></td>
        <td>demo</td>
        <td>last</td>
    </tr>
    <tr>
        <td>two</td>
        <td class="order"><a href="#">three two</a></td>
        <td>sample</td>
    </tr>
    <tr>
        <td>two</td>
        <td class="order"><a href="#">five two</a></td>
        <td>sample</td>
    </tr>
    <tr>
        <td>five</td>
        <td>quick</td>
        <td class="order"><a href="#">nine</a></td>
    </tr>
</table>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Answer 2

index是一个变量，所以你必须将它添加到jQuery中的字符串中，如：

$(".order").click(function() {
    var index = $(".order").index(this);
    var text = $(".order:eq("+(index-1)+")").text();
    alert(text);
});

DEMO

Answer 3

您需要根据集合

找到索引

var $orders = $('.order').click(function () {
    var index = $orders.index(this);
    if (index > 0) {
        var text = $orders.eq(index - 1).text();
        alert(text);
    }
});

演示：Fiddle

使用jquery中的index或eq按类捕获元素

3 个答案: