Javascript setTimeout触发太快

我有一个工具提示（它只是一个div），在另一个元素的mouseover事件中出现。 我试图使工具提示隐藏在主元素的mouseleave事件上，然而，如果鼠标在工具提示上，我希望工具提示保持可见

工具提示位于其元素的正下方

我的代码如下：

var option_hide_timeout;

$(".option").mouseover(function () {
    showTooltip($(this));
});
$(".option").mouseleave(function () {
    option_hide_timeout = setTimeout(hideTooltip(), 2000); // delay the hiding to allow the mouse to enter the tooltip
});
$("#option_tt").mouseenter(function () {
    clearTimeout(option_hide_timeout);
});
$("#option_tt").mouseleave(function () {
    hideTooltip();
});

function showTooltip(parent) {
    var parentPos = parent.position();
    $("#option_tt").css({
        visibility: "visible",
        left: parentPos.left,
        top: parentPos.top + $(parent).height()
    });
}
function hideTooltip() {
    $("#option_tt").css("visibility", "hidden");
}

问题是，鼠标离开主元素后，工具提示立即隐藏。 这个问题在Chrome、Firefox、Opera和IE浏览器中一直存在

不管延迟值是多少（在我的代码中，2000只是一个示例，在实践中它很可能更短），它都会立即触发

我尝试过使用mouseover/mouseout和mouseenter/mouseleave，两者都产生了相同的结果，这让我得出结论：

setTimeout（hideTooltip（），2000）

这是不对的

在mouseleave事件中放置警报可以确保代码正在被调用

我错过了什么明显的东西吗？如果是这样的话，请将指针指向正确的方向。

更改

option_hide_timeout = setTimeout(hideTooltip(), 2000); 

到

---

添加的括号使函数立即被调用，而不是被赋予

setTimeout

我似乎已经解决了自己的问题

$(".option").mouseleave(function () {
    option_hide_timeout = setTimeout(hideTooltip(), 2000); // delay the hiding to allow the mouse to enter the tooltip
});

应该是：

$(".option").mouseleave(function () {
    option_hide_timeout = setTimeout(function () { hideTooltip() }, 2000);
});

---

这很简单，我应该在发布之前意识到这一点。

谢谢。这也有效，比我作为后续发布的内容更优雅。

$(".option").mouseleave(function () {
    option_hide_timeout = setTimeout(function () { hideTooltip() }, 2000);
});