如何取消绑定() .hover() 但不取消绑定.click()？

我正在使用 Bootstrap 3 创建一个网站，并且还使用一个脚本，使用 .hover() 函数使下拉菜单出现在悬停时。我试图通过使用 enquire.js 在小型设备上防止这种情况。我正在尝试使用以下代码取消绑定元素上的 .hover() 事件：

$('.dropdown').unbind('mouseenter mouseleave');

这会解除该脚本的 .hover 绑定，但显然它也删除了 .click() 事件（或引导程序使用的任何事件），现在当我悬停或单击该元素时，什么也没有发生。

所以我只想知道如何删除该元素上的 .hover() ，该元素源自该脚本，但不更改其他任何内容。

非常感谢任何帮助。

Thanks!

Edit:以下是我调用悬停函数的处理程序的方法：

$('.dropdown').hover(handlerIn, handlerOut);

function handlerIn(){
   // mouseenter code
}
function hideMenu() {
   // mouseleave code
}

我正在尝试用这段代码解除它们的绑定。

$('.dropdown').unbind('mouseenter', showMenu);
$('.dropdown').unbind('mouseleave', hideMenu);

但它不起作用。

请帮忙！

**编辑2：**基于Tieson T.的回答：

function dropdownOnHover(){
  if (window.matchMedia("(min-width: 800px)").matches) {
    /* the view port is at least 800 pixels wide */
    $('.dropdown').hover(handlerIn, handlerOut);

    function handlerIn(){
       // mouseenter code
    }
    function hideMenu() {
       // mouseleave code
    }
  }
}

$(window).load(function() {
  dropdownOnHover();
});

$(window).resize(function() {
  dropdownOnHover();
});

Tieson T. 提供的代码效果最好；但是，当我调整窗口大小时，直到从任何方向到达断点为止，效果都不会改变。也就是说，如果窗口加载到 800px 以上，悬停效果将会存在，但如果我将窗口缩小，它仍然存在。我尝试使用 window.load 和 window.resize 调用函数，但它仍然是相同的。

Edit 3:我实际上正在尝试在悬停而不是单击时创建 Bootstrap 下拉菜单。这是更新后的 jsFiddle：http://jsfiddle.net/CR2Lw/2/ http://jsfiddle.net/CR2Lw/2/

请注意：在 jsFiddle 示例中，我可以使用 css :hover 属性并将 dropdow-menu 设置为 display:block。但因为我需要设置下拉菜单的样式，所以链接和下拉菜单之间需要有一些空间（这是必须的），所以我必须找到一个 JavaScript 解决方案。或者一个非常棘手的CSS解决方案，其中链接和下拉菜单之间有大约50px的空间，当用户将鼠标悬停在链接上并且下拉菜单出现时，当用户尝试访问它时，下拉菜单不应该消失。希望这是有道理的，谢谢。

编辑 4 - 第一个可能的解决方案： http://jsfiddle.net/g9JJk/6/ http://jsfiddle.net/g9JJk/6/

有选择地应用悬停可能会更容易，而不是稍后尝试将其删除。您可以使用窗口.matchMedia https://developer.mozilla.org/en-US/docs/Web/API/Window.matchMedia并且仅当浏览器的屏幕尺寸意味着桌面浏览器（或较大的平板电脑）时才应用您的脚本：

if (window.matchMedia("(min-width: 800px)").matches) {
    /* the view port is at least 800 pixels wide */
    $('.dropdown').on({
        mouseenter: function () {
            //stuff to do on mouse enter
        },
        mouseleave: function () {
            //stuff to do on mouse leave
        }
    });
}
else{
    $('.dropdown').off('mouseenter, mouseleave');
}

由于它不是 100% 支持，您需要为那些没有本机支持的浏览器添加一个填充：https://github.com/paulirish/matchMedia.js/ https://github.com/paulirish/matchMedia.js/

如果您使用的是 Moderizr，则该 polyfill 已包含在该库中，因此您可以使用了。