Jquery hover/mouseenter 功能不工作

Question

标题。我查找了多个示例，但 none 有效，例如-

$(".thumb-link").on({
  mouseenter: function() {
    alert("yay");
  },
  mouseleave: function() {
    alert("boo");
  }
});

$(document).on('mouse-enter', '.thumb-link', function(e) {
  alert("yay");
});

$(document).on('hover', '.thumb-link', function(e) {
  alert("yay");
});

我以前用过悬停功能，感觉快要疯了。为什么这些不起作用？

编辑- 问题是因为链接是从数据库生成的吗？即使这样，jquery 也必须有某种方法来应用悬停功能。相同的元素具有有效的点击功能。

Answer 1

中有错别字

$(document).on('mouse-enter','.thumb-link',function(e){
    alert("yay");
});

mouse-enter 应该是 mouseenter

如果你不得不使用 hover，你可以这样做：

$('.thumb-link').hover(
  function(e) {
    alert("yay");
  },
  function(e) {
    alert("boo");
  }
)

.thumb-link {
  height: 100px;
  outline: 1px red solid;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="thumb-link"></div>

Answer 2

你打错了，mouse-enter应该是mouseenter。

Jquery hover/mouseenter 功能不工作

Jquery hover/mouseenter functions not working

html

jquery

mouseenter

jquery-hover