如何使用javascript MouseEvents来区分中间点击同时左右点击?

时间:2017-07-31 23:25:12

标签: javascript html events mousedown

示例:

document.querySelector("body").addEventListener("mousedown", (e) => console.log(e.button, e.buttons));

如果你把它放在浏览器的控制台中...... 中间点击日志1,4和左右按钮同时记录1,4。

浏览器是否会消除点击次数并以一定延迟报告?我怎样才能区分这两件事?

1 个答案:

答案 0 :(得分:0)

var buttonsMap = {
  1 : "primary",
  2 : "contextmenu",
  3 : "primary + contextmenu",
  4 : "middle",
  5 : "primary + middle",
  6 : "contextmenu + middle"
}


document.body.addEventListener("mousedown", (e) => {

  console.log( buttonsMap[e.buttons] );   // Here you go

  // What you could do:
  if( /3|5|6/.test(e.buttons) ) {
    console.log("DOUBLE!!!");
  } else {
    console.log("single");
  }

});

<强> jsBin demo

https://w3c.github.io/uievents/#dom-mouseevent-buttons