0

我有 2 个功能来显示和清除窗口。最初我用 jquery hover 命令将它们定义为内联，就像在中一样$('item').hover(function() {...}, function() {...});，这非常有效。但是，如果我从这些函数调用中获取代码并将它们隔离以调用它$('item').hover(function1, function2);，结果会有所不同。在前一种情况下，我得到了预期的行为。也就是说，在悬停时元素显示，如果鼠标离开悬停元素，则在超时后淡出。在第二个版本中，新元素会显示，在超时后淡出，并且不会在悬停时重新出现。

我假设它与我正在使用的超时有关，但我完全从原始函数中复制了这些函数，所以理论上它应该是相同的事情发生......或者我会天真地假设。要么是那个，要么我在某个地方打错了，我只是没有抓住。

完整代码和 html 的小提琴可在此处（工作版本）和此处（损坏版本）获得。

这是有效的代码：

$('#test').hide();
var timeout;

$('a').hover(function(){
    $('#test').show();
    clearTimeout(timeout);
}, function(){
    timeout = setTimeout(function(){
        $('#test').fadeOut('fast', function(){});
    }, 1000);
});

这就是失败的原因：

$('#test').hide();
var timeout;

function clearWindow() {
    timeout = setTimeout(function(){
        $('#test').fadeOut('fast', function(){});
    }, 1000);
}

function showWindow() {
    $('#test').show();
    clearTimeout(timeout);
}

$('a').hover(showWindow(), clearWindow());
4

2 回答 2

3

将函数传递给.hover().

$('a').hover(showWindow, clearWindow);

括号调用函数，这意味着您传递的是调用/而不是函数本身返回的值。showWindow()clearWindow()

于 2013-07-05T05:11:31.203 回答
3

当您打算传递函数时，您正在调用它们：

$('a').hover(showWindow(), clearWindow());
                       ^^             ^^

改用它（您想传递函数本身，而不是undefined它们返回的 ( ) 值）：

$('a').hover(showWindow, clearWindow);

请注意，一般来说，移动到不同函数的代码可能会表现出不同的行为，因为它可能引用一组不同的上下文变量（即位于与原来不同的范围内）。但是，这不适用于您在此处拥有的功能。

于 2013-07-05T05:12:11.080 回答