Javascript 无论如何，要阻止一个；onmousemove“；当鼠标仍在移动区域时是否正常工作？

我正在创建一个小游戏，用户用鼠标在画布上画直线（使用onmousedown和onmouseup作为开始和结束事件）。我尝试使用onmousedown和onmousemove创建该行的预览，以指导用户。问题是，在用户释放鼠标按钮之后，“onmousemove”仍然会从用户释放鼠标的位置创建预览

我尝试过使用返回0或返回一段时间（好）（我是JavaScript新手），但都不起作用。 是否有可能完全抛弃onmousemove并使用某种计时器（比如C#）

HTML

剧本

function startline ()
{
    oldx = event.pageX; // globally declared
    oldy = event.pageY;
    $(document.getElementById("myCanvas")).on("mousemove",function()
    {
        var ctx = document.getElementById("myCanvas").getContext("2d");
        livex = event.pageX;
        livey = event.pageY;
        ctx.beginPath();
        ctx.lineWidth = 5;
        ctx.strokeStyle = "#808080";
        ctx.moveTo(vechix, vechiy);
        ctx.lineTo(livex, livey);
        ctx.stroke();
    }); 
}
function endline ()
{
    var x = event.pageX;
    var y = event.pageY;
    var ctx = document.getElementById("myCanvas").getContext("2d");
    ctx.lineWidth = 5;
    ctx.beginPath();
    ctx.strokeStyle = "#000000";
    ctx.moveTo(oldx, oldy);
    ctx.lineTo(x, y);
    ctx.stroke();
}

我希望onmousemove函数在释放鼠标时停止。

---

此外，输出创建了1000行并显示了所有行，但我已经设法解决了这个问题。

当您获得一个

mouseup

事件时，

off（）

使用

mousemove

事件侦听器将其删除。看：非常感谢！添加$（document.getElementById（“myCanvas”）.off（“mousemove”）；在“mouseup”事件中，监听器完全解决了我的问题。无需编写

文档。getElementById

内部

$（）

。。。当您获得一个

mouseup

事件时，可以简化为

$（“#myCanvas”）

，

off（）

使用

mousemove

事件侦听器将其删除。看：非常感谢！添加$（document.getElementById（“myCanvas”）.off（“mousemove”）；在“mouseup”事件中，监听器完全解决了我的问题。无需编写

文档。getElementById

内部

$（）

。。。可以简化为

$（'#myCanvas'）

function startline ()
{
    oldx = event.pageX; // globally declared
    oldy = event.pageY;
    $(document.getElementById("myCanvas")).on("mousemove",function()
    {
        var ctx = document.getElementById("myCanvas").getContext("2d");
        livex = event.pageX;
        livey = event.pageY;
        ctx.beginPath();
        ctx.lineWidth = 5;
        ctx.strokeStyle = "#808080";
        ctx.moveTo(vechix, vechiy);
        ctx.lineTo(livex, livey);
        ctx.stroke();
    }); 
}
function endline ()
{
    var x = event.pageX;
    var y = event.pageY;
    var ctx = document.getElementById("myCanvas").getContext("2d");
    ctx.lineWidth = 5;
    ctx.beginPath();
    ctx.strokeStyle = "#000000";
    ctx.moveTo(oldx, oldy);
    ctx.lineTo(x, y);
    ctx.stroke();
}