jQuery 用于获取 Table 行上的 Click 事件答案

【问题标题】：jQuery for getting Click event on a Table rowjQuery 用于获取 Table 行上的 Click 事件
【发布时间】：2011-07-25 13:38:57
【问题描述】：

我有下表

<table>
<tr class="rows"><td>cell1</td><td>cell2</td></tr>
</table>

如果我使用 jquery 点击any of the column of <tr class="rows">，如何设置警报消息？

【问题讨论】：

标签： javascript jquery

【解决方案1】：

您可以使用委托以获得更好的性能，它将点击事件附加到行的根容器，即表

$(document).ready(function(){
    $("tableSelector").delegate("tr.rows", "click", function(){
        alert("Click!");
    });
});

【讨论】：

你好，我怎样才能在这个函数中获取colomn hearer html？
@NikhilDinesh - 您可以使用event.target 找出单击了哪一列并获取它的索引。使用索引，您可以从标题中选择所需的列并获取 html。
如何获取 td 内容（问题示例中的“cell1”和“cell2”文本）？
delegate 现在已弃用。请改用.on

【解决方案2】：

$(
  function(){
      $(".rows").click(
        function(e){
            alert("Clicked on row");
            alert(e.target.innerHTML);
        }
      )
  }
)

Example

更好的解决方案

$(document).on("click","tr.rows td", function(e){
    alert(e.target.innerHTML);
});

【讨论】：

$(document).on("click","tr.rows td", function(e){ alert(e.target.innerHTML); });这对于添加的新行非常有用

【解决方案3】：

$(document).ready(function(){
    $("tr.rows").click(function(){
        alert("Click!");
    });
});

【讨论】：

【解决方案4】：

$(".rows").click(function (){ 
   alert('click');
});

【讨论】：