html canvas中的onmousedown，ondmouseup，onclick，ondblclick，oncontextmenu

Question

我在html画布中工作，我需要做4个动作：

• 拖放元素
• 弹力元素
• creat elemnts
• 编辑元素

所以：

• 拖放：我应该使用canvas.onmousedown和canvas.ondmouseup
• stretch：canvas.onclick选择元素，然后canvas.onclick元素的框架
• creat：canvas.ondblclick
• 编辑：canvas.oncontextmenu

但onmousedown和ondmouseup“覆盖”所有其他的clic。 和onclic“覆盖”ondblclick

我试过了：

canvas.oncontextmenu = function(event) {
        myContextmenu(canvas);   
       return false;
    }

和

canvas.addEventListener('ontextmenu', function(e) {
     alert("right clic"+e.clientX+";"+e.clientY);
   }, true);

如果我尝试使用onmousedown，ondmouseup，onclick fonction，那么另一个不起作用。

如果有人可以帮助我欢迎

Answer 1

您必须使用onmousedown和onmouseup管理自己的点击和双击检测。

点击是onmousedown之后的onmouseup，两者之间几乎没有移动。

双击当然是快速连续点击。

所以你必须存储一些状态变量，比如mousedown的位置和日期（这在拖动时很有用，所以你可以随时计算移动）。

如果你手动拖动＆amp; drop（即没有使用不那么兼容的HTML5新功能）你必须将鼠标移到onmousemove上，以便你可以在移动过程中显示被拖动的对象（它有助于检测向下和向上之间的移动）。