如何在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() {