jquery - 离开悬停状态

Question

我有2个div标签.第一个包含一个表.第二个包含一些文字.加载页面时,两个div都没有背景色.当第一个div的td上有悬停时,第二个div背景颜色设置为黄色(参见下面的代码).我的问题是,当我用鼠标离开桌子时,第二个div的背景保持黄色.我希望在离开悬停状态时删除颜色.希望有人能提供帮助.提前感谢您的回复.干杯.渣.

我的HTML:

?<div id="div-one">
    <table>
        <tr><td>1</td><td>2</td></tr>
        <tr><td>3</td><td>4</td></tr>
        <tr><td>5</td><td>6</td></tr>
        <tr><td>7</td><td>8</td></tr>                   
    </table>
</div>

?<div id="div-two">
    some text
</div>

我的JS:

$(document).on("hover", "#div-one td", function() { 

    $("#div-two").css("background-color":"yellow");
});?

Answer 1

单独使用mouseenter和mouseleave事件 - 这实际上是一个"悬停"事件:

$(document).on({
    mouseenter: function() {
        $("#div-two").css("background-color", "yellow");
    },
    mouseleave: function() {
        $("#div-two").css("background-color", "");
    }
}, "#div-one td");?

DEMO