knockout.js事件绑定 - mouseover和mouseout事件的意外行为

Question

我所看到的问题是，当我执行以下操作时，鼠标悬停事件似乎不会出现：

<div data-bind='events: {mouseover: someFunc, mouseout: someOtherFunc}'>
    <div data-bind='text: someText'></div>
</div>

我所看到的是当我最初悬停时，someFunc函数触发（我正在使用这些函数来应用类来获得悬停效果）。但是，当我的光标进入内部div时，我的mouseout函数会触发，即使mouseover事件应该从内部div传递到外部div。

这个小提琴演示了这个问题： http://jsfiddle.net/cSBcC/1/

在小提琴中，只需尝试将鼠标悬停在各种li上，当光标进入内部div时，“hover”类将被删除，即使我们仍然在鼠标悬停在li上。

有什么想法吗？

Answer 1

如果您正在引用jQuery（您是），那么您可以使用mouseleave代替mouseout，因为它的行为与您期望的一样。

即使从外部元素移动到内部元素，

mouseout事件也会触发。

以下是使用mouseleave：http://jsfiddle.net/rniemeyer/KUNcf/

的示例

另一种选择是只使用CSS并删除事件绑定，如：http://jsfiddle.net/rniemeyer/KUNcf/2/

li.name:hover {
    background-color: yellow;        
}