6

我正在开发一个应用程序,我需要跟踪鼠标滚轮的移动,但我的功能在 Internet Explorer 中没有按预期工作。它适用于所有其他浏览器,但不适用于 IE,关于我做错了什么有什么想法吗?

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);
        }
    }   
}

我在正文中调用 setupMouseWheel 函数 onload

<body onload="setupMouseWheel();">

谢谢您的帮助!

4

2 回答 2

15

要听鼠标滚轮,最好听DOMMouseScrollmousewheelwheel。最后一个是 IE,是唯一一个你不听的。

我还要指出,jQuery 有一个绑定多个事件的快捷方式:

 $(elem).on("DOMMouseScroll mousewheel wheel", onMouseWheelSpin);

更新:注意到虽然您将其标记为 jQuery,但您实际上并没有使用它。要在没有 jQuery 的情况下执行此操作,只需照常进行,但添加一个wheel与其他事件一样的事件侦听器。

于 2013-05-26T15:45:51.547 回答
4

对于遇到类似问题的任何人,我终于在这里找到了一种很棒的跨浏览器方法

https://developer.mozilla.org/en-US/docs/Web/Reference/Events/wheel

于 2013-05-26T16:44:51.973 回答