Question

我有一张如下表格

<table onclick="dosomething()">
<tr><td>11</td><td>12</td><td>13</td></tr>
<tr><td>11</td><td>12</td><td>13</td></tr>
<tr><td>11</td><td>12</td><td>13</td></tr>
</table>

点击表格后，我需要找到点击发生的td。我不能在tr或td上写上onclick事件。

Answer 1

你可以做这样的事情（给你的table一类myClass - 或任何你想要的东西：

function tableClicked(td) {
    // Do something dependent on the td which was clicked
}

$(document).ready(function () {
    $("table.myClass td").click(function () {
        tableClicked(this);
    });
});

这意味着您无需向onclick代码添加<td>个属性。

Answer 2

向表中添加ID并删除onClick处理程序。这是分离行为和内容。

<table id="tableId">

因为事件会冒出来，在table元素上捕获它并找到目标，所以你不需要为每个td添加事件监听器。

$('#tableId').click(function(e){
     //the td is the target where event happens
     var td=e.target;
});

Answer 3

我会转储onclick并执行此操作

$("#myTable td").click(function() {
   $(this).html();    // get the value
   $(this).hide();    // hide it
   $(this).remove();  // remove it
});

<table id="myTable">
   <tr><td>11</td><td>12</td><td>13</td></tr>
   <tr><td>11</td><td>12</td><td>13</td></tr>
   <tr><td>11</td><td>12</td><td>13</td></tr>
</table>

Answer 4

$(function(){
    $("#tbl").bind("click", function(e){
        if(e.target.tagName == "TD"){
            //do your magic
        }
    });
});

查找与其表onclick事件关联的td

4 个答案: