Question

我的表格如下：

<table width="100%" border="0" cellspacing="0" cellpadding="0" class="lanpaizt-tab">
                <tr class="lanpaizt-tr1">
                    <td class="wid70">id</td>
                    <td class="wid150">nickname</td>
                    <td class="wid150">account</td>
                    <td class="wid150">mail</td>
                    <td class="wid100">tel</td>
                    <td>operate</td>
                </tr>

                <tr>
                    <td rowspan="2" id="member_id">2</td>
                    <td rowspan="2">lisi</td>   
                    <td>dksdkl</td>
                    <td>dka@gmail.com</td>
                    <td rowspan="2">123456</td>
                    <td rowspan="2">
                        <button class="editbtn"></button>
                        <button class="deletebtn"></button>
                    </td> 
                </tr>         
                <tr>
                    <td>sdlsd</td>
                    <td>ndjksa@gmail.com</td>
                </tr>

</table>

我希望通过两种方式获取id为“member_id”的单元格值，但失败了：

1

$('.deletebtn').click(function(){

    var user_id = $(this).closest('#member_id').text()
    console.log(user_id)
})

2。

$('.deletebtn').click(function(){

    var user_id = $(this).closest('tr').siblings('#member_id').text()
    console.log(user_id)
})

他们都得到空值。我的代码出了什么问题？有没有其他方法可以得到它？感谢。

Answer 1

您的方法中的问题是，#member_id是删除按钮直接父td的兄弟。您应该遍历父元素并使用以下命令查找其兄弟：

$('.deletebtn').click(function(){

  var user_id = $(this).parent().siblings('#member_id').text()
  console.log(user_id)
});

ID也应该是唯一的。你可以简单地使用id选择器获取元素。遍历和查找的需求将被消除：

var user_id = $('#member_id').text();

Answer 2

试试这个：http://jsfiddle.net/ouL1p1k9/

$('.deletebtn').click(function(){

    var user_id = $(this).closest('tr').find('#member_id').text()
    alert(user_id)
});

OR

$('.deletebtn').click(function(){

        var user_id = $(this).closest('tr').find('td:first-child').text()
        alert(user_id)
    });

Answer 3

尝试这样的事情：

$(this).closest('#member_id').html()

Answer 4

在DOM中，Id必须是唯一的，你应该使用id选择器直接获取jquery对象，不需要使用.find()，.closest()等方法遍历元素。见下文代码 -

$('.deletebtn').click(function(){

  var user_id = $('#member_id').text()
  console.log(user_id)
})

Answer 5

这不是很好，但解决方法如下：

$('.deletebtn').click(function(){

        var user_id = $(this).parent().parent().find('#member_id').text();
        console.log(user_id)
})

您还可以考虑在实际删除按钮上设置member_id值：

<button class="deletebtn" id='2'></button>

然后像这样编写你的javascript处理程序：

$('.deletebtn').click(function(){

        var user_id = $(this).prop('id');
        console.log(user_id)
})

但是假设你如何解决这个问题并不重要。

使用jquery获取表格单元格中的值

5 个答案: