我想用 Javascript 为任何可能的鼠标事件编写一个通用的 eventListener。
我正在尝试编写一个 eventListener 来处理网页内的任何鼠标移动、任何类型的按下、滚动以及可以使用鼠标完成的所有操作。
我没有找到一个好的方法，也因为我需要使用没有 jQuery 或任何其他库的纯 Javascript 来完成它，只使用简单的 DOM 元素和函数。
任何人都可以通过编写一个好的处理程序(而不是为每个可能的事件编写一个处理程序)来告诉我它是如何完成的吗？
最佳答案
您可以为所有鼠标事件添加事件监听器，但使用相同的处理函数。像这样:
function bindEventsToSameHandler(element, events, handler) {
for(var i = 0; i < events.length; i++) {
element.addEventListener(events[i], handler);
}
}
// ...
// usage
var element = document.getElementById('selector'); // select the element on which to handle mouse events
var events = ['click', 'mouseup', 'mousedown']; // add mouse events you want to handle
bindEventsToSameHandler(element, events, function() {
// your handler code goes here
});
注意:这适用于 任何 事件，而不仅仅是与鼠标相关的事件。
这是一个例子:
function bindEventsToSameHandler(element, events, handler) {
for(var i = 0; i < events.length; i++) {
element.addEventListener(events[i], handler);
}
}
// usage
element = document.getElementById('capture');
events = ['click', 'dblclick', 'mouseup', 'mousedown']; // add your events here
bindEventsToSameHandler(element, events, function(e) {
console.debug('handled ' + e.type);
});#capture {
width: 100%;
height: 100%;
border: 1px solid black;
padding: 100px;
}<body>
<p id='capture'>CAPTURE EVENTS BOX</p>
</body>关于javascript - 使用 JavaScript 检测页面中的任何鼠标事件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26286218/