javascript - How to refresh event argument on mouse down with interval?

Question

Since onmousedown doesn't work like if you were to hold onkeydown I have had to compromise and create my own style of it, so far I have come up with this:

can.onmousedown = function(e) { 
    map.moving = setInterval(function() {
        console.log(e.pageX + ' ' + e.pageY);
        map.posX = e.pageX;
        map.posY = e.pageY;
    }, 70);
}

can.onmouseup = function(e) {
    clearInterval(map.moving);
}

Which works great, the only problem I'm having now, is that the e argument is only being set upon initial click so the mouse coords stay the same for the entire interval, any idea how I can fix this?

Answer 1

您还需要调用mousemove。

can.onmousemove = function(e) {
    if( map.moving ) {
        console.log(e.pageX + ' ' + e.pageY);
        map.posX = e.pageX;
        map.posY = e.pageY;
    }
};

can.onmousedown = function(e) {
    map.moving = true;
};

can.onmouseup = function(e) {
    map.moving = false;
};

或者，您可能希望解耦并减慢mousemove处理程序的执行速度，因为这种情况会发生（例如scroll events，非常快）。例如，这也可以通过调用来完成timeouts。

Answer 2

尝试这个：

can.onmousedown = function(e) { 
    map.moving = setInterval(function() {
        e = e || window.event;
        console.log(e.pageX + ' ' + e.pageY);
        map.posX = e.pageX;
        map.posY = e.pageY;
    }, 70);
}

can.onmouseup = function(e) {
    clearInterval(map.moving);
}