如何在第二次单击时锁定函数

Question

我有一个侧边栏，可以在悬停时展开。

因为展开、折叠有时会干扰我想要在有人点击侧边栏时解除悬停。

底部的代码用于第一次解除绑定，但第二次单击以再次启用悬停不起作用：

    $('.action').click(function(){
        $(this).unbind('mouseenter').unbind('mouseleave');
        $(this).click(function(){
            $(this).bind('mouseenter').bind('mouseleave');
        });
    });

那么，如何在锁定时再次绑定悬停(请不要构造)。

问候

Answer 1

$('.action').on('mouseenter mouseleave', doStuffOnHover); //initial handler

var bound = true;

$('.action').on('click', function(){
      $(this)[bound ? 'off' : 'on']('mouseenter mouseleave', doStuffOnHover);
      bound=bound ? false:true;
});

function doStuffOnHover() {
   //do stuff here
}

FIDDLE

如果在mouseenter/leave上做不同的事情，你当然需要两个函数。

Answer 2

您需要绑定实际的事件.bind('mouseenter', function () { /* whatever */ });。jQuery不会自动知道您想要重新绑定已经存在的内容。如果您愿意，您可以使用命名函数，这样您就不必重写它。