javascript - jQuery在mousedown和mouseup之间获取所有x和y

我使用Raphael制作了一个简单的绘图应用程序。我现在尝试绘制波浪线（是否有更好的词），所以我想捕获mousedown和mouseup之间的所有x和y。在这个stackoverflow问题jQuery continuous mousedown处，有一个在事件之间做某事的解决方案，但是我无法让x和y正常工作。我正在尝试使用mousemove（）来获取它，但是当函数结束时mousemove（）不会停止。拥有可以自动调用x和y的函数会使我陷入无限循环。所以...两件事，如何连续获取x和y以及如何避免无限循环。我知道如何将其放入数组中，然后弯成行，只是不知道如何执行鼠标侦听器。我现在拥有的代码是：

var paper = new Raphael($('#canvas')[0], 500, 500);
var canvas =$('#canvas');

var stillDown = false;
canvas.mousedown(function(){
    console.log("down");
    stillDown = true;
    whileDown();
});

function whileDown(){
    if(!stillDown){return;}else{
    console.log("Still in down.");
        canvas.mousemove(function(e){
        //console.log("X: " + e.offsetX + " Y: " + e.offsetY);
    });
    whileDown();
    }
}

canvas.mouseup(function(){
    stillDown = false;
});

我当前的目标只是在控制台中显示它处于关闭状态，所有x和y处于关闭状态，并且它处于启动状态，此后不显示任何内容。然后，我将处理该信息。无论如何，任何帮助都会很棒！

最佳答案

在mousedown上，只需设置布尔标志：

var stillDown = false;
canvas.mousedown(function(){
    console.log("down");
    stillDown = true;
});

在mousemove上，如果设置了标志，则将坐标推入数组：

var coords = [];
canvas.mousemove(function(e){
    if(!stillDown) return;
    console.log("moving");
    coords.push({x: e.offsetX, y: e.offsetY});
    // and/or do whatever you need with the coordinates
}

在mouseup上，取消设置标志：

canvas.mouseup(function(){
    stillDown = false;
});

关于javascript - jQuery在mousedown和mouseup之间获取所有x和y，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/15778344/