为什么我的 html 表格忽略点击？答案

【问题标题】：Why is my html table ignoring clicks?为什么我的 html 表格忽略点击？
【发布时间】：2016-09-16 05:33:28
【问题描述】：

我有一个像这样的 html 表格：

<table id="top10ItemsTable">
    <tr>
        <th>Item Code</th>
        <th>Description</th>
        <th class="rightjustifytext">Qty</th>
    </tr>
    . . .

我想响应该表格内的点击，因此将其添加到就绪函数中：

$("body").on("click", "#top10ItemsTable", function () {
    alert('you clicked inside the Top 10 Items quadrant table');
});

...但是单击 html 表格不会产生任何警报，除非它是微观的或不可见的。

需要什么东西才能用力戳桌子以清除皮屑？

【问题讨论】：

看起来工作得很好jsfiddle.net/rb1hyxh2/19
您对包含表格的任何元素都有点击处理程序吗？该处理程序是否使用event.stopPropagation 或return false;？
请参阅 stackoverflow.com/questions/39301652/… 了解相关说明。

标签： javascript jquery html html-table

【解决方案1】：

你可以这样做：

$("#top10ItemsTable").click(function () {
     alert('you clicked inside the Top 10 Items quadrant table');
}

【讨论】：

【解决方案2】：

试试这个：

$(document).on("click", "#top10ItemsTable", function () {

    alert('you clicked inside the Top 10 Items quadrant table');

})

最终代码：

<!DOCTYPE html>
<html lang="en">
<head>
</head>
    <body>
      <table id="top10ItemsTable">
    <tr>
        <th>Item Code</th>
        <th>Description</th>
        <th class="rightjustifytext">Qty</th>
    </tr>
        </table>
        
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
       <script>
           

    
$(document).on("click", "#top10ItemsTable", function () {
    
    alert('you clicked inside the Top 10 Items quadrant table');
        
})     
       </script>
    </body>
</html>

【讨论】：