hoverIntent触发select元素的'out'函数

Question

后面的代码用于显示和隐藏Mega Dropdown.如果你鼠标悬停在'dropDown'类的链接上,那么它的子节点'.dropPanel'会显示.只要您的鼠标位于链接或下拉面板上,就会显示下拉面板.将光标移动到链接或面板的任何位置,并隐藏面板.很基本的东西.

在其中一些Mega Dropdown中,有些表格包含选择元素.在Firefox中,一切都很好.在IE中(具体来说,8没有测试过任何其他版本),如果你鼠标悬停在下拉面板中的select元素上,hoverIntent将触发dropPanelOff()的'out'函数,并且下拉面板会隐藏.

我该如何防止这种情况？

        // Apply Hover Intent to Menu Panels
        $(".dropDown").hoverIntent({
            sensitivity: 10, 
            interval: 150, 
            over: dropPanelOn, 
            timeout: 150, 
            out: dropPanelOff
        });

            // Menu Over function call
            function dropPanelOn() {
                $('a[rel="dropLink"]', this).addClass('hover');
                $('.dropPanel', this).slideDown('fast');
            }

            // Menu Out function call
            function dropPanelOff() {
                obj = this;
                $('.dropPanel', this).slideUp(100, function(){
                    $('a[rel="dropLink"]', obj).removeClass('hover');
                    $('.dropLink span', obj).removeClass('hover');
                });
            }

Answer 1

尝试将此添加到您的代码中:

$(".dropDown select").mouseout(function(e) {
        e.stopPropagation();
});