带有事件参数的Javascript setTimeout 函数调用？

Question

使用 setTimeout 时拉入事件对象的最佳方法是什么？我正在使用 jQuery 来处理所有浏览器中事件模型的标准化，但我不确定如何将“e”对象放入 checkPos 函数中。

我当前的代码：

function MouseDownEvent(e) {
    *snip*
    timeoutID = setTimeout(checkPos(e), 500);
}
function checkPos(e) {
    //function uses e on a timeout of 500ms
    timeoutID = setTimeout( checkPos(e) }, 500);
}

目前该代码可以工作一次，因为该函数是在 mousedown 事件中调用的，但在用户移动鼠标时永远不会更新 e 对象。 FF javascript 错误控制台还声明它是“无用的 setTimeout 调用（参数周围缺少引号？）”，但遵循该建议会导致它完全失败。

如何从 setTimeout 调用中提取“e”事件参数？

编辑：添加到每 500 毫秒重新运行 checkPos 函数的代码中

Answer 1

尝试：

function MouseDownEvent(e) {
    *snip*
    timeoutID = setTimeout(function(){checkPos(e);}, 500);
}
function checkPos(e) {
    //function uses e on a timeout of 500ms
}

根据OP评论进行编辑..

要在每次触发checkPos时访问更新的事件：

var myNamespace = {};

$('body').mousemove(function(e) {
    myNamespace.mouseEvent = e; 
});

function checkPos() {
    doSomethingWith(myNamespace.mouseEvent);
}

timerID = setInterval(checkPos, 500);

Answer 2

首先，为什么要使用两次超时？在我看来， setInterval() 会更好

function MouseDownEvent(e) {
 *snip*
 clearInterval(intervalID);
 intervalID = setInterval(function(){checkPos(e);}, 500);
}

其次，您能否澄清这一点：“...但永远不会在用户移动鼠标时更新 e 对象。”为什么当用户移动鼠标时事件对象会更新？您只分配了一个 mouseDown 处理程序。如果您想在每次鼠标移动时执行某些操作，那么您应该使用 mouseMove 事件，在这种情况下，超时/间隔无论如何都是不必要的。

function MouseMoveEvent(e) {
 //called every time the mouse is moved, event object will contain position
}

与 JavaScript 中一样，您应该首先寻找事件驱动的解决方案，并且仅在绝对必要时才使用定时处理程序。

*编辑-解决评论中提出的问题*

var handler = {
    i : 0,
    function : mouseMoveEvent(e) {
      handler.i++;
      if (handler.i % 100 == 0) {
        //Do expensive operations
      }
    }
}

$(myElement).bind("mousemove", handler.mouseMoveEvent);

Answer 3

您可以使用 curry 函数，此处有一个用于 jQuery 的函数。

一般来说，你会这样：

function foo(a, b)
{
    alert(a + b);
}

var bar = curry(foo, 1);

bar(2); // alerts 3, as if you had called foo(1, 2)

所以你可以这样做：

setTimeout(curry(checkPos, e), 500);

因为 curry 返回一个函数，其第一个参数绑定到 e，所以你可以将它直接传递到 setTimeout 中。

Answer 4

据我所知，IE 不允许按照您的需要传递“事件”对象。

我能想到的唯一解决方法是提前将您需要的任何值存储为全局变量，然后在延迟函数中检查该变量。

例如： http://jsfiddle.net/YvYtn/1/

这将显示最后一个 X 位置，您可以从事件对象中存储您需要的任何内容。

JS代码：

var _lastPosX= null;
function MouseDownEvent(evt) {
    if (typeof evt == "undefined" || !evt)
        evt = window.event;
    _lastPosX = (evt.clientX || evt.pageX);
    timeoutID = window.setTimeout("checkPos();", 500);
}
function checkPos() {
    alert(_lastPosX);
}