Question

我有旋转jQuery选项卡，当你将鼠标悬停在它们上面时我想暂停它们并在你点击时停止旋转。

然而，尽管暂停工作正常，但我无法解除悬停事件（甚至单独解除绑定鼠标中心和鼠标左键）。

我在这里用两种不同的方法创建了两个jsfiddles，这两种方法都有同样的问题。

function tab_hover_in() {
        $(this).tabs('rotate', 0, false);
}
function tab_hover_out() {
        $(this).tabs('rotate', 3000, false);
}
function tab_click() {
        $(this).tabs('rotate', 0, false);
        $(this).unbind('mouseenter',tab_hover_in);
        $(this).unbind('mouseleave',tab_hover_out);
        event.preventDefault();  
}

$('.tabs-rotate').tabs({
        selected: 'tabs-1'
}).tabs('rotate', 3000, false);

$('.tabs-rotate').bind({
        'click': tab_click,
        'mouseenter': tab_hover_in,
        'mouseleave': tab_hover_out
});

http://jsfiddle.net/bdrvC/16/

$('.tabs-rotate').tabs({
  selected: 'tabs-1'
}).tabs('rotate', 3000, false);

$('.tabs-rotate').hover(function() {
    $(this).tabs('rotate', 0, false);
  }, function() {
    $(this).tabs('rotate', 3000, false);
});
$('.tabs-rotate').click(function() {

  $(this).tabs('rotate', 0, false);
  $(this).unbind('mouseleave');

});

有人能解释为什么即使点击后轮换仍在继续吗？

非常感谢！

Answer 1

您的点击事件未绑定到正确的元素...您可以使用

$('.ui-tabs-nav li a').click(function() {...});

代替

在单击中取消绑定jquery悬停事件处理程序

1 个答案: