0

私がやろうとしているのは、マウスボタンを押している間、別の関数を継続的に呼び出す関数を作成することです。.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(function(self){と、毎秒約300倍でコンソールに「オン」ログが記録されますが、イベントは失われます。だから私の質問は、関数をコールバックしてイベントパラメータを渡すことができるようにするにはどうすればよいですか？

例-http://jsfiddle.net/ZxKxD/

通勤中の家でこれを考えて、両方のイベントを続けておくといいと思いました。これが私の最終的なコードです：

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);
});
4

1 に答える 1

4

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);
    });
}

デモ： http： //jsfiddle.net/mattball/9veUQ

では、どうすればカーソル位置を継続的に更新できますか？

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);
    });
};

デモ： http： //jsfiddle.net/mattball/dVaWS/

于 2012-08-03T23:03:59.157 に答える