Question

如何通过点击get

获取特定的列（状态）值

<table>
    <tr>
        <td><a href="#">get</a></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td grid-colid='Status'>false</td>
    </tr>
    <tr>
        <td><a href="#">get</a></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td grid-colid='Status'>true</td>
    </tr>
    <tr>
        <td><a href="#">get</a></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td grid-colid='Status'>false</td>
    </tr>
</table>

var statusVal = $(this).closest('tr').next("td[grid-colid='Status']").html();

Answer 1

您必须使用.find()

$('table a').on('click',function(){
    var statsVal=$(this).closest('tr').find('td[grid-colid="Status"]').html()
});

Answer 2

对于性能问题，如果您使用事件委派（设置单个处理程序而不是为每个链接设置处理程序）并使用find()检索右列，则效果更好。在给定的示例中，并不一定要在选择器中指定属性值。

此外，如果您需要检索纯文本，则只需使用text()方法而不是html();

$('table').on('click', 'a', function() {
   var statusVal = $(this).closest('tr').find("td[grid-colid]").text();
   console.log(statusVal);
});

示例：http://codepen.io/anon/pen/LskuG

Answer 3

如果你的HTML不会改变，你可以简单地横向于正确的元素，而不必使用任何更快的CSS选择器。

$(".button").on("click", function(ev) {
    ev.preventDefault();    
    // first parent give the td, the second give the tr
    var status = $(this).parent().parent().children().last().text();

    console.log(status);
});

这是jsfiddle http://jsfiddle.net/5VEeE/

Answer 4

你需要使用find（）方法作为@Anton，但你也可以通过使用nextAll（）方法来做到这一点（并且选择多个元素也很好）：

var statusVal = $(this).closest('td').nextAll("td[grid-colid='Status']").html();

点击时无法获得td列值

4 个答案: