为什么鼠标单击表格行时无法获取行id

Why I can not get the row id when mouse clicked on a table row?

本文关键字：获取 id 单击 表格 为什么 鼠标      更新时间：2023-09-26

我有一个index.html页面，其中有一个表：

<body>
      <table class="mytable">
          <tr id="1">
              <td>John</td>
              <td>123</td>
          </tr>
           <tr id="2">  
              <td>Kate</td>
              <td>456</td>
          </tr>
      </table>
  <script src="my.js"></script>
  </body>

我已经在我的页面中包含了my.js，我试图在my.js中以以下方式获取鼠标点击行的id：

$('.mytable tr').click(function(e){
                   alert('clicked.'); //even did not get alert here.
                   var rowId = $(this).attr('id');
               alert(rowId);
        });

但是我没有得到点击行的行id（没有警报），我错在哪里了？

---解决方案---

糟糕的是，我有一个地方清空了桌子，这意味着根本没有tr。这就是为什么它不起作用。抱歉打扰了。

  1. $ === jQuery
  2. 绑定单击侦听器的代码是否在文档就绪处理程序中执行
  3. this.id就足够了，可以在所有浏览器中使用

这似乎很好。。。这里有一个正在工作的JSFiddle，它使用alert而不是console.log：

http://jsfiddle.net/gfosco/KtYkJ/

根据评论和马特的回答，你应该这样包装你的函数：

$(document).ready(function() {
    $('.mytable tr').click(function(e){
               var rowId = $(this).attr('id');
           alert(rowId);
    });
});

javascript是在DOM准备好之前执行的，因此没有应用处理程序。

它对我有用。

如果不是id，你会得到什么？

最常见的问题是事件处理程序没有绑定到元素，对此，最常见的解决方案是将其封装在$(document).ready(){ ... }中，以便在绑定到元素之前等待DOM加载。

（还有一个相对较新的.live()函数，它在文档生命周期中添加元素时与元素绑定。）

首先，您必须检查您的js文件路径是否正确？如果这是正确的，那么我认为你的脚本中没有任何错误。。我也测试过。。。你可以查一下演示

将事件处理程序更改为

$('.mytable tr').each(function() {
    $(this).click(function() {
        var rowId = $(this).attr("id");
        alert(rowId);
    });
});
相关文章：