jquery - jQuery禁用功能

在我的网站上，我使用Bootstrap并具有带有下拉菜单的导航菜单。

现在，我添加了一些JS代码以在悬停时打开下拉菜单。

    <!-- MouseOver on menu -->
        $(function() {
            $("li.dropdown").hover(
                function(){ $(this).addClass('open') },
                function(){ $(this).removeClass('open') }
            );
        });

    },

我还使用enquire仅在桌面上激活此悬停效果。

<!-- Activate javascript based on mediaquery -->
$(document).ready(function() {
    enquire.register("screen and (min-width:40em)", {

        // If supplied, triggered when a media query matches.
        match : function() {
        <!-- MouseOver on menu -->
            $(function() {
                $("li.dropdown").hover(
                    function(){ $(this).addClass('open') },
                    function(){ $(this).removeClass('open') }
                );
            });

        },

        // If supplied, triggered when the media query transitions from a matched state to an unmatched state.
        unmatch : function() {
            <!-- MouseOver on menu -->
            $(function() {
                $("li.dropdown").unbind("hover");
            });

        }
    });
});

现在，enquire.js部分运行正常。因此，当用户在桌面上时，会将.hover属性赋予该函数。当他在移动设备上时，下部执行。但是，如何再次删除此.hover属性？

我正在尝试取消绑定或取消设置功能，但这似乎不起作用。

            $(function() {
                $("li.dropdown").unbind("hover");
            });

也许这是一个基本的问题，但是我不擅长jQuery并且有点卡住。

最佳答案

我在http://api.jquery.com/hover处查看了文档，您需要取消特定的绑定方式：

$("li.dropdown").off( "mouseenter mouseleave" );

在您的特定实例上我也可能错了，但是您可以为此使用直接CSS而不是JavaScript / Enquire。

旁注：我不认为您需要在匹配/不匹配中使用额外的$(function(){ ... })包装，因为您已经在.ready方法中执行了此包装。