javascript - 使用JQuery将鼠标悬停在元素上x秒时如何触发点击？

Question

我知道已经问过这个问题，并且已经在这里回答了，但是设置一个计时器可以使用 hover() 函数。

由于我的元素是动态创建的，因此它需要两个不同的功能：一个在 mouseenter 上，另一个在 mouseleave 上。

有人对这种特殊需求有见解吗？

PS：我知道有一个叫 hoverIntent 的插件，但是我不想使用任何插件！

Answer 1

尝试

$(document).on({
    mouseenter: function () {
        var $this = $(this);
        var timer = setTimeout(function () {
            $this.click();
        }, 2000)
        $this.data('clicktimer', timer)
    },
    mouseleave: function () {
        clearTimeout($(this).data('clicktimer'))
    }
}, '#test');

演示：小提琴

Answer 2

像这样的东西？

$('.myelement').on('mouseenter', function(e) {
  var element = $(this),
      ctx = null,
      timeout = 2000;

  ctx = setTimeout(function() {
     element.trigger('click');
     clearTimeout(ctx);
  }, timeout);
});