jquery：使用其id动态锚定名称超时

Question

嘿嘿！

我可能在这里是个傻瓜，但我想不通；

我正在用 javascript 中的基本 hover() 函数构建一个水平菜单。当您离开锚点时，在悬停效果消失之前会有短暂的超时。

所以我想做的是：在锚点的 ID 之后命名 Timeout，触发 mouseleave 以在 mouseenter 上再次停止正确的 Timeout。

在 Mouseenter 上，我通过获取 id 检查哪个锚点悬停，我取消了此 id 的超时并将 hvr-Class 添加到悬停的锚点：

var t = $(this).attr('id');
clearTimeout(t);
$(this).addClass('hvr');

在 Mouseleave 上，我基本上想这样做：

$(this).attr('id') = setTimeout('doSoemthing()',66);

但这会导致错误，因为 = 的左侧不允许使用该表达式。我想到了这样的事情：

var ts = $(this).attr('id');
ts = setTimeout('doSoemthing()',66);

但这也不起作用，因为它只是覆盖了变量 t。相反，我想“打印”超时名称的变量值。如果我使用固定的超时名称，一切都像一个魅力，但比每个链接只有一个（相同的）超时，它不会这样做。

有没有办法做到这一点？还是我跑题了？

这就是完整的功能：

$("nav a").hover(

  function(){

  // On MouseEnter
    var t = $(this).attr('id');
    clearTimeout(t);
    $(this).addClass('hvr');

  },function(){

  // On MouseLeave
    $(this).attr('id') = setTimeout(function(){doSomethingHere},66);

  }

);

提前致谢，致以最诚挚的问候。

Answer 1

据我了解，您需要根据悬停元素保留对超时事件的引用，您可以使用 .data() 来做到这一点

我认为你正在寻找的是

$("nav a").hover(function () {
    clearTimeout($(this).data('mltimer'));
    $(this).addClass('hvr');
}, function () {
    var timer = setTimeout('doSoemthing()', 66);
    $(this).data('mltimer', timer)
});