前言
基于原生JavaScript, 在使用three.js的raycaster模拟瞄准及射击时用到.文章来源地址https://www.toymoban.com/news/detail-725712.html
一、代码
const obj = window;
let eventList = [];
let isDouble = false;
obj.addEventListener("mouseup", e => { mouseUp(e) });
obj.addEventListener("mousedown", e => { mouseDown(e) });
obj.addEventListener("mousemove", e => { mouseMove(e) });
obj.addEventListener("contextmenu", e => { e.preventDefault() }); // 阻止浏览器默认右键菜单
function mouseDown(e) {
if (e.button === 1) return; // 中键
eventList.push(e.button); // e.button 0左键 1中键 2右键
judge();
}
function mouseUp(e) {
if (e.button === 1) return;
if (eventList.length === 2) isDouble = false;
remove(e.button);
}
function mouseMove(e) {
if(!isDouble) return;
if(eventList[0] === 0) {
console.log('left-right-moving');
} else {
console.log('right-left-moving');
}
}
function remove(val) {
if (eventList[0] == val) {
eventList.shift();
return;
}
if (eventList[1] == val) {
eventList.pop();
return;
}
}
function judge() {
if (eventList.length === 2) {
if (eventList[0] === 0) { // 数组全等不区分元素顺序
console.log('left-right');
} else {
console.log('right-left');
}
isDouble = true;
}
}
总结
文章来源：https://www.toymoban.com/news/detail-725712.html
到了这里，关于JavaScript 监听鼠标左右同时按下/同时按下移动的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
![[JavaScript游戏开发] 绘制冰宫宝藏地图、人物鼠标点击移动、障碍检测](https://imgs.yssmx.com/Uploads/2024/02/608253-1.png)
