如何解决如何在TR中为TD解除jQuery中的鼠标悬停绑定?
| 这是我的HTML:<table id=\"myTable\">
<tr class=\"myTr\">
<td>
CELL 1
</td>
<td>
Cell 2
</td>
<td class=\"notThis\">
Cell 3
</td>
</tr>
<tr class=\"myTr\">
<td>
2- CELL 1
</td>
<td>
2- Cell 2
</td>
<td>
2- Cell 3
</td>
</tr>
</table>
<div id=\"myDiv\">CONSOLE</div>
而我的Javascript:
$(document).ready( function() {
$(\".myTr\").mouseover( function() {
$(\"#myDiv\").html( \"OVER\" );
} );
});
我想要它,以便当您将鼠标悬停在\“ notThis \”单元格上时,不会触发鼠标悬停。我设置了一个小提琴进行测试:http://jsfiddle.net/S7bfH/3/
谢谢
解决方法
这里:
工作演示
$(\".myTr td:not(\'.notThis\')\").hover( function() {
$(\"#myDiv\").html( \"ACTIVE\" );
},function() {
$(\"#myDiv\").html( \"INACTIVE\" );
});
, 您需要停止事件传播;这样可以防止事件冒泡到绑定其他处理程序的祖先元素。使用绑定到td
元素的处理程序中的event.stopPropagation()
执行此操作:
$(\'.notThis\').mouseover(function(event) {
event.stopPropagation();
});
, 例如使用.not()方法
$(\".myTr\").not(\".notThis\").mouseover( function() {
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。