Question

所以我有一个元素可以在单击时切换两种背景颜色。但是当未选择元素时，我希望背景颜色在悬停时更改（并恢复）。我尝试在切换中使用.on（'hover'）和.off（'hover'），但只有.off（）似乎有效。

$('.element').hover(
  function() {
    $(this).css('background', '#e7f1f5');
  },
  function() {
    $(this).css('background', '#fff');
  }
);

$('.element').toggle(
  function( select ) {
    select.preventDefault();
    $(this).off('hover');
    $(this).css('background', '#f6f6f6');
    other.code();
  },
  function( unselect ) {
    unselect.preventDefault();
    $(this).on('hover');
    $(this).css('background', '#fff');
    other.code();
  }
);

我切换'打开'，'悬停'事件不再触发（根据需要）。当我切换'关闭'时，'悬停'事件仍然不会触发。

我是jQuery和StackOverflow的新手，所以如果这个问题很简单，我很抱歉。

谢谢！

Answer 1

使用css：

.element{
   background-color:#FFF;
}
.element.hover{
   background-color:#e7f1f5;
}

代替$(this).off('hover');执行：

$(this).addClass('hover');

代替$(this).on('hover');执行：

$(this).removeClass('hover');

jQuery Toggle和Hover功能

1 个答案: