Javascript 在setInterval函数中使用.call（）传递参数

我想做的是做一个函数，只要按住鼠标按钮，它就会连续调用另一个函数。我这样做只是为了更好地理解.call（）和回调。这是我的密码：

jQuery.fn.contmousedown = function(mousedownCallback){
  var interval, self = this;
  jQuery(this).mousedown(function(event){
    interval = setInterval(function(self, event){
      mousedownCallback.call(self, event);
      console.log('on');
    },0);
  });
  jQuery(this).mouseup(function(event){
    clearInterval(interval);
  });
}

$(document).contmousedown(function(e){
  $('#run').html(e.pageX+', '+e.pageY);
});

我收到的错误是：

Uncaught TypeError: Cannot read property 'pageX' of undefined

当然，我每秒会收到大约300倍的信息如果我将间隔声明行更改为

interval=setInterval（函数（self）{

，那么我会以每秒300x的速度登录到控制台，但我会丢失事件。因此，我的问题是，我如何才能使其生效，以便回调函数并将事件参数传递给它？

---

在回家的路上考虑到这一点，我决定把这两件事都保留下来，这是我最后的代码：

jQuery.fn.mousehold = function(mousedownCallback){
  var interval, self = this, move_event;
  jQuery(this).mousemove(function(e){
    move_event = e;
  });
  jQuery(this).mousedown(function(click_event){
    interval = setInterval(function(){
      mousedownCallback.call(self, click_event, move_event);
    },0);
  });
  jQuery(this).mouseup(function(){
     clearInterval(interval);
  });
  jQuery(this).mouseout(function(){
     clearInterval(interval);
  });
}

$(document).mousehold(function(click_event, move_event){
  $('#run').html(click_event.pageX+':'+move_event.pageX+', '
                +click_event.pageY+':'+move_event.pageY);
});

---

setInterval

不会向回调传递参数，因此请删除

self

和

event

参数。这样做不会“丢失”事件

$.fn.contmousedown = function(mousedownCallback)
{
    var interval,
        self = this;

    $(this).mousedown(function(event)
    {
        interval = setInterval(function()
        {
            mousedownCallback.call(self, event);
            console.log('on');
        }, 0);
    });

    $(this).mouseup(function()
    {
        clearInterval(interval);
    });
}

演示：

---

那么我怎样才能得到光标位置的持续更新呢

使用

mousemove

捕获事件

$.fn.contmousedown = function(mousedownCallback)
{
    var interval,
        self = this,
        event;

    $(this).mousemove(function(e)
    {
        event = e;
    });

    $(this).mousedown(function ()
    {
        interval = setInterval(function()
        {
            mousedownCallback.call(self, event);
        }, 0);
    });

    $(this).mouseup(function()
    {
        clearInterval(interval);
    });
};

---

演示：

setInterval

不会将参数传递给回调，因此请删除

self

和

event

参数。这样做不会“丢失”事件

$.fn.contmousedown = function(mousedownCallback)
{
    var interval,
        self = this;

    $(this).mousedown(function(event)
    {
        interval = setInterval(function()
        {
            mousedownCallback.call(self, event);
            console.log('on');
        }, 0);
    });

    $(this).mouseup(function()
    {
        clearInterval(interval);
    });
}

演示：

---

那么我怎样才能得到光标位置的持续更新呢

使用

mousemove

捕获事件

$.fn.contmousedown = function(mousedownCallback)
{
    var interval,
        self = this,
        event;

    $(this).mousemove(function(e)
    {
        event = e;
    });

    $(this).mousedown(function ()
    {
        interval = setInterval(function()
        {
            mousedownCallback.call(self, event);
        }, 0);
    });

    $(this).mouseup(function()
    {
        clearInterval(interval);
    });
};

---

演示：

你没有调用应该创建闭包的函数..或者你正在隐藏一个变量..@pst-你是什么意思？@pst-nah，不是那样的。看我的答案。你没有调用应该创建闭包的函数..或者你正在隐藏一个变量..@pst-你是什么意思？@pst-nah，不是这样的。请参阅我的答案。是的，应该这样做。闭包共享局部变量，无论您在该范围内嵌套函数的深度是谁。@MattBall-当我这样做时，我的

$（“#run”）.html

代码只运行一次。它会更新到我单击的第一个位置，但不会跟踪我的光标。@Aust否；代码会反复运行。原因是事件的坐标没有更新。也许可以用一个例子来说明这一点：@Aust It's get run，坐标总是相同的。只创建了一个mousedown事件，在你按下鼠标按钮的坐标处。如果你在按下鼠标按钮的同时移动鼠标，该事件将不会再次触发。也许你想要

mousemove

？@MattBall-Hmm，很有趣。那么我怎样才能获得光标位置的连续更新呢？是的，这应该可以做到。闭包共享局部变量，不管在该范围内嵌套函数的深度。@MattBall-当我这样做时，我的

$（“#run”）.html

代码只运行一次。它会更新到我单击的第一个位置，但不会跟踪我的光标。@Aust否；代码会反复运行。原因是事件的坐标没有更新。也许可以用一个例子来说明这一点：@Aust It's get run，坐标总是相同的。只创建了一个mousedown事件，在您按下鼠标按钮的坐标处。如果在按下鼠标按钮的同时移动鼠标，则不会再次触发该事件。也许您想要

mousemove

？@MattBall-Hmm，很有意思。那么如何获得光标位置的连续更新？