如何使用 JavaScript 在 Firefox 中触发鼠标滚轮事件？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6735830/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to fire mouse wheel event in Firefox with JavaScript?
提问by Justin Aquadro
I'm trying to do automated testing with WebDriver, but it currently has no ability to simulate mouse wheel events. As a workaround I'm trying to fire these events with JavaScript instead. I'm doing all my wheel experimenting on a straight HTML page right now, not within the WebDriver framework.
我正在尝试使用 WebDriver 进行自动化测试，但它目前无法模拟鼠标滚轮事件。作为一种解决方法，我正在尝试使用 JavaScript 来触发这些事件。我现在正在一个直接的 HTML 页面上做我所有的轮试验，而不是在 WebDriver 框架内。
I'm specifically trying to fire a mouse wheel event on a scrolling div element.
我特别想在滚动的 div 元素上触发鼠标滚轮事件。
So far I've been able to do this with Chrome and IE9, but I can't seem to get anything to work in Firefox (5.x).
到目前为止，我已经能够使用 Chrome 和 IE9 来做到这一点，但我似乎无法在 Firefox (5.x) 中使用任何东西。
I'm using the following cross-browser code to detect when mouse wheel events are fired, which I snagged off the net. This code is able to pick up the event in all browsers when I scroll the mouse wheel within the scrolling div I've created (id='view').
我正在使用以下跨浏览器代码来检测鼠标滚轮事件何时被触发，这是我从网上截获的。当我在我创建的滚动 div (id='view') 中滚动鼠标滚轮时，此代码能够在所有浏览器中获取事件。
<script type="text/javascript">
function wheel(event) {
var delta = 0;
if (!event) {
event = view.event;
}
if (event.wheelDelta) {
delta = event.wheelDelta / 120;
}
else if (event.detail) {
delta = -event.detail / 3;
}
alert(delta);
}
var view = document.getElementById('view');
if (view.addEventListener) {
view.addEventListener('DOMMouseScroll', wheel, false);
}
view.onmousewheel = wheel;
</script>
The function below, when called, is able fire the mouse wheel event in Chrome and IE9, and gets picked up in the above handler with expected behavior.
下面的函数在调用时能够在 Chrome 和 IE9 中触发鼠标滚轮事件，并在上面的处理程序中以预期的行为被拾取。
function ChromeWheel () {
var evt = document.createEvent("MouseEvents");
evt.initEvent('mousewheel', true, true);
evt.wheelDelta = 120;
view.dispatchEvent(evt);
}
Of course, it does not work for Firefox. I've found existing documentation to be too sparse and confusing to know how FF handles this. Can anyone show me the bare minimum to fire a mouse wheel event in Firefox with a wheel delta (placed where FF expects it), such that my handler will pick it up?
当然，它不适用于 Firefox。我发现现有文档过于稀疏且令人困惑，无法了解 FF 如何处理此问题。任何人都可以向我展示在 Firefox 中使用滚轮增量（放置在 FF 期望它的位置）触发鼠标滚轮事件的最低限度，以便我的处理程序将其捡起？
采纳答案by Nickolay
Well,
好，
- In the Mozilla part of the code, if you're listening for DOMMouseScroll you should dispatch a DOMMouseScroll event too, no? (mousewheel seems to be a Microsoft invention copied by webkit, but not Gecko).
- Instead of setting (readonly) properties on the event, you're supposed to call the appropriate
init...()method, which for the mouse event isinitMouseEvent(). (spec)
- 在代码的 Mozilla 部分，如果您正在侦听 DOMMouseScroll，您也应该分派 DOMMouseScroll 事件，不是吗？（鼠标滚轮似乎是webkit 复制的微软发明，但不是 Gecko）。
- 您应该调用适当的
init...()方法，而不是在事件上设置（只读）属性，对于鼠标事件，该方法是initMouseEvent(). (规格)
Here's a fixed up testcase, which works in Firefox: http://jsfiddle.net/6nnMV/
这是一个固定的测试用例，它适用于 Firefox：http: //jsfiddle.net/6nnMV/
Probably not useful to you, but may be of interest to other people looking to simulate events, here's how (privileged) unit tests in mozilla simulate 'real' events: http://hg.mozilla.org/mozilla-central/annotate/a666b4f809f0/testing/mochitest/tests/SimpleTest/EventUtils.js#l248
可能对您没有用，但可能对其他希望模拟事件的人感兴趣，以下是 mozilla 中的（特权）单元测试如何模拟“真实”事件：http: //hg.mozilla.org/mozilla-central/annotate/ a666b4f809f0/testing/mochitest/tests/SimpleTest/EventUtils.js#l248
