jQuery //你能在$（document）.on（....？

Question

无论如何这有用吗？我知道只需.hover()函数即可完成此操作，但我的结果是使用ajax生成的。

Codepen

$(document).on('mouseenter', '.result',
  function() {
    $(this).addClass("result_hover");
  },
  function() {
    $(this).removeClass("result_hover");
  }
);

.result_hover {
  color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<h1 class="result">
  Result
</h1>

Answer 1

如jQuery.hover中所述：

  

.hover（）方法为mouseenter和mouseleave事件绑定处理程序。

如果您只对一个处理程序感兴趣，可以使用toggleClass(className, state)。

所以你可以这样做：

＆＃13;

＆＃13;

$(document).on('mouseenter mouseleave', '.result', function(e) {
  $(this).toggleClass("result_hover", e.type == 'mouseenter');
});

＆＃13;

.result_hover {
  color: red;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<h1 class="result">
  Result
</h1>

＆＃13;

＆＃13;

＆＃13;