javascript - 如何在jQuery中首先隐藏类并仅在悬停时显示？

Question

我有以下切换脚本：

  $('.edit_bg').on({
    mouseenter: function () {
      $(this).addClass('edit_bg');
    },
    mouseleave: function () {
      $(this).removeClass('edit_bg');
    }
  });

但这在我第一次悬停该 div 后有效。

我应该如何在开始时从 div 中删除所有.edit_bg类并能够在悬停时显示它们？

Answer 1

在 on 功能之后，只需执行removeClass.

$('.edit_bg').on({
    mouseenter: function () {
        $(this).addClass('edit_bg');
    },
    mouseleave: function () {
        $(this).removeClass('edit_bg');
    }
}).removeClass('edit_bg');

Answer 2

我了解您尝试使用 Javascript/jQuery 实现的目标，但您只需使用 css 即可实现：

.edit_bg
{
    background-color: blue;
}

.edit_bg:hover
{
    background-color: red;
}

看，妈！没有javascript！http://jsfiddle.net/adrianonantua/rv9ht/