jquery - 在 Html 表中是否可以获取位于另一行的元素的 id？

Question

我有这个 HTML 表结构，我在其中定义了各种行(tr's):

<table>
    <tr><td><button id="1" onclick="getid()"></button></td></tr>
    <tr><td><button id="2" onclick="getid()"></button></td></tr>
    <tr><td><button id="3" onclick="getid()"></button></td></tr>
    <tr><td><button id="4" onclick="getid()"></button></td></tr>
    <tr><td><button id="5" onclick="getid()"></button></td></tr>
</table>
<script>
    function getid(){
        alert($(this).closest('[id]'));
    }
</script>

单击任何按钮时，我应该能够获取位于行上方和行下方的按钮的 ID。

我没有得到。出了什么问题？

Answer 1

修改 onclick 处理程序将 this 作为 Html 中的参数传递，然后使用 .next() 和 .prev() jQuery 方法如下所示:-

HTML:-

<table>
    <tr><td><button id="1" onclick="getid(this)"></button></td></tr>
    <tr><td><button id="2" onclick="getid(this)"></button></td></tr>
    <tr><td><button id="3" onclick="getid(this)"></button></td></tr>
    <tr><td><button id="4" onclick="getid(this)"></button></td></tr>
    <tr><td><button id="5" onclick="getid(this)"></button></td></tr>
</table>

jQuery :-

<script>
function getid(elem){
    alert($(elem).closest('tr').prev('tr').find('button').attr('id'));
    alert($(elem).closest('tr').next('tr').find('button').attr('id'));
}
</script>

DEMO