jQuery 单击表格单元格事件 [英] jQuery click on table cell event

问题描述

我有一个像下面这样的html代码

I have a html code like below

<tbody>
  <tr id="info">
    <td class="name">Joe</td>
    <td class="surname">White</td>
    <td class="age">25</td>
 </tr>
</tbody>

还有一个像这样的 jQuery 代码:

and there is a jQuery code like this:

$("tr#info").click(function() {        // function_tr
  $(this).css("background-color","yellow");
});

$("tr#info td").click(function() {     // function_td
  $(this).css("font-weight","bold");
});

当我点击 td 时，function_td 工作正常，但 function_tr 也工作.
如何防止function_tr?

When I click on the td, function_td works fine but function_tr also works.
How to do prevent function_tr?

推荐答案

你需要使用event.stopPropagation()

$("tr#info td").click(function(e){     //function_td
  $(this).css("font-weight","bold");
  e.stopPropagation();
});

这篇关于jQuery 单击表格单元格事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！