mac本的触控板多次触发滚轮事件，为什么？

Question

监听滚轮事件进行整屏翻动动画，我用mac本的触摸板，当滑动的快的时候，会多次触发我的动画，但是我的每个滚动都有开关，动画开始，开关关闭；动画完毕，开关打开，开始接受下一个滚动动画；在监听滚轮滚动事件时，我只是监听了他的滚动方向，返回值为正负，来判断是向上还是向下滑，并没有监听他的滚动速度，即使mac本上的滚动速度不恒定，但正负是不变的 ，我只监听了他的正负，但出现以上问题，不知道问题在哪?正常浏览器没有问题。下面是监听滚轮滚动方向兼容各浏览器的函数，求大神解答

window.onload = function () {
        var oDiv = document.getElementById('div1');
 
        function onMouseWheel(ev) {/*当鼠标滚轮事件发生时，执行一些操作*/
            var ev = ev || window.event;
            var down = true; // 定义一个标志，当滚轮向下滚时，执行一些操作
                down = ev.wheelDelta?ev.wheelDelta<0:ev.detail>0;
            if(down){
                oDiv.style.height = oDiv.offsetHeight+10+'px';
            }else{
                oDiv.style.height = oDiv.offsetHeight-10+'px';
            }
            if(ev.preventDefault){/*FF 和 Chrome*/
                ev.preventDefault();// 阻止默认事件
            }
            return false;
        }
        addEvent(oDiv,'mousewheel',onMouseWheel);
        addEvent(oDiv,'DOMMouseScroll',onMouseWheel);
     }
    function addEvent(obj,xEvent,fn) {
        if(obj.attachEvent){
            obj.attachEvent('on'+xEvent,fn);
        }else{
            obj.addEventListener(xEvent,fn,false);
        }
    }

Answer 1

javascript - fullpage.js滑轮上下滚动较快的时候屏幕就会乱窜。 - SegmentFault 思否
https://segmentfault.com/q/10...

这个问题基本能解决, 但还不够完美, 可以看看

Answer 2

这个可以使用节流函数处理，可以使用现成的工具lodash中的throttle方法，示例如下：

// { 'trailing': false }调用在节流结束后，默认为true，即表示允许在 wait 期间多次调用
        window.addEventListener(mousewheelevt, _.throttle(this.handleScroll, 1200, { 'trailing': false }), false)

文档地址：http://lodash.think2011.net/t...

Answer 3

我现在也遇到了这个问题。也在找答案。你找到答案了吗