javascript 鼠标滚轮事件在 ie 中不起作用
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/16756260/
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
mousewheel event is not working in ie
提问by Juan Gonzales
I am working on an application and I need to track the mouse wheel movement but my functions are not working as I expect in Internet Explorer. It works in all other browsers but not IE, any ideas on what I am doing wrong?
我正在开发一个应用程序,我需要跟踪鼠标滚轮的移动,但我的功能在 Internet Explorer 中没有像我期望的那样工作。它适用于所有其他浏览器,但不适用于 IE,对我做错了什么有任何想法吗?
JS...
JS...
var request = true;
var onMouseWheelSpin = function(event) {
if(request === true){
request = false;
var nDelta = 0;
if (!event) { event = window.event; }
// cross-bowser handling of eventdata to boil-down delta (+1 or -1)
if ( event.wheelDelta ) { // IE and Opera
nDelta= event.wheelDelta;
if ( window.opera ) { // Opera has the values reversed
nDelta= -nDelta;
}
}
else if (event.detail) { // Mozilla FireFox
nDelta= -event.detail;
}
if (nDelta > 0) {
zoomFun( 1, event );
}
if (nDelta < 0) {
zoomFun( -1, event );
}
if ( event.preventDefault ) { // Mozilla FireFox
event.preventDefault();
}
event.returnValue = false; // cancel default action
}
}
var zoomFun = function(delta,e) {
if(delta > 0){ // zoom in
alert("In");
}else{ // zoom out
alert("Out");
}
request = true;
}
var setupMouseWheel = function(){
// for mouse scrolling in Firefox
var elem = document.getElementById("zoom");
if (elem.addEventListener) { // all browsers except IE before version 9
// Internet Explorer, Opera, Google Chrome and Safari
elem.addEventListener ("mousewheel", onMouseWheelSpin, false);
// Firefox
elem.addEventListener ("DOMMouseScroll", onMouseWheelSpin, false);
}else{
if (elem.attachEvent) { // IE before version 9
elem.attachEvent ("onmousewheel", onMouseWheelSpin);
}
}
}
I am calling the setupMouseWheel function onload in the body aka
我在体内调用 setupMouseWheel 函数 onload 又名
<body onload="setupMouseWheel();">
Thanks for the help!
谢谢您的帮助!
采纳答案by Juan Gonzales
I finally found a great cross browser approach here for anyone who has a similar issue
我终于在这里找到了一个很好的跨浏览器方法,适用于任何有类似问题的人
https://developer.mozilla.org/en-US/docs/Web/Reference/Events/wheel
https://developer.mozilla.org/en-US/docs/Web/Reference/Events/wheel
回答by Dave
To listen to the mouse wheel, it's best to listen to DOMMouseScroll
, mousewheel
and wheel
. The last one is IE, and is the only one you're not listening for.
要听鼠标滚轮,最好听DOMMouseScroll
,mousewheel
和wheel
。最后一个是 IE,并且是唯一一个你没有在听的。
I'll also point out that jQuery has a shortcut for binding multiple events:
我还要指出 jQuery 有一个绑定多个事件的快捷方式:
$(elem).on("DOMMouseScroll mousewheel wheel", onMouseWheelSpin);
update: noticed that though you tagged this as jQuery, you're not actually using it. To do this without jQuery, just carry on as you are but add a wheel
event listener like the others.
更新:请注意,尽管您将其标记为 jQuery,但您实际上并未使用它。要在没有 jQuery 的情况下执行此操作,只需按原样继续操作,但要wheel
像其他人一样添加一个事件侦听器。