在JavaScript中合並鼠標事件

Question

我正在嘗試使用javascript構建類似Paint的Web應用程序。 用戶應該能夠用鼠標在像素網格上方“繪制”形狀。 我如何使用DOM事件監聽器使它正常工作？

使用此行，用戶可以一個接一個地設置單個像素：

td.addEventlistener("click", setpixel);

所以我想我必須將mousedown和mouseover結合在一個事件監聽器中。 那可能嗎？

Answer 1

本質上，您不能組合事件偵聽器。 但是您可以使用多個偵聽器來跟蹤游標的狀態。

var mouseIsDown = false
el.addEventListener('mousedown', function(){mouseIsDown = true})
el.addEventListener('mouseup', function(){mouseIsDown = false})

然后，您需要確定鼠標移動時該怎么做。

el.addEventListener('mousemove', function(){
    if(mouseIsDown){
        // implement drawing logic here
    }
})