jQuery/浏览器选择悬停事件的问题答案

【问题标题】：jQuery/browser issue with hover events on selectjQuery/浏览器选择悬停事件的问题
【发布时间】：2012-09-18 09:31:31
【问题描述】：

首先，我查找了我的问题，但发现的主题并不密切相关，我相信这可能与我在 google 上找到的不同，感谢您抽出时间来研究我的问题。

http://jsfiddle.net/dSJMG/

在这里您可以看到一个演示，其中我使用 jQuery 1.8 并有一个包含标签和选择元素的 div，这些已打开悬停事件以提供编辑功能，并发现当悬停字段并选择任何选项时选择下拉菜单，有时会触发 mouseleave 事件，但是我没有用鼠标指针离开选项列表。这似乎是以非确定性的方式发生的，更常见的是在更快地移动选项上的指针时（但仍然没有离开其区域）。我也可以在每个主流浏览器上重现它，但是我知道只有 IE 正式有这个错误。

这可能与定位有关，因为当我增加容器与其子容器之间的空间时，问题似乎得到了解决。

感谢任何想法。

谢谢

【问题讨论】：

标签： jquery html cross-browser position jquery-hover

【解决方案1】：

var $select = $("select.sel"), $label = $("label.lab");

$(".cont").hover(function(evt) {
    if (evt.type === "mouseenter") {
        $select.val($label.hide().text()).show();
        $select.addClass('active');
    } else {
        if(!$select.hasClass('active')) {
            $label.text($select.hide().val()).show();
            $select.removeClass('active');
        }
    }
});

$("select.sel").change(function() {
    if($select.hasClass('active')) {
        $label.text($select.hide().val()).show();
        $select.removeClass('active');             
    }
});

更改 jQuery like this

【讨论】：

感谢代码更新，我希望这是一个已知的错误，不需要使用任何解决方法。