JS阻止浏览器滚动事件

在前几天的项目中，场景值如下：
1.动态生成列表，列表高度不固定
2.外面父元素的属性设置为overflow:auto;
3.鼠标移动到列—li中的a上,出现选择列表，鼠标在列表上，列表不消失
4.当鼠标放置到出现的列表上时，再滚动滑轮，因为出现的列表为是根据标签a的位置来进行定位的，所以滚动的时a页面在滚动，但列表位置虽然没变，但与原来a标签相符合的位置却变了

---

因为父元素overflow的存在，无法使用hover状态，超出的部分会隐藏掉或者会出现跳动的状态。所以就用了如果在a标签上就阻止页面的滚动事件，代码如下。

    //阻止浏览器事件
    function disabledMouseWheel() {  
           document.addEventListener('DOMMouseScroll', scrollFunc, false);  
           document.addEventListener('mousewheel',scrollFunc,false);
    }
    //取消阻止浏览器事件
    function cancelDisMouseWheel(){
           document.removeEventListener('DOMMouseScroll',scrollFunc,false);
           document.removeEventListener('mousewheel',scrollFunc,false);
    }  
    function scrollFunc(evt) {  
           evt = evt || window.event;  
            if(evt.preventDefault) {  
                // Firefox  
                evt.preventDefault();  
                evt.stopPropagation();  
                } else{  
                // IE  
                evt.cancelBubble=true;  
                evt.returnValue = false;  
        }  
             return false;  
    }

跳动状态如下图

如有疑问，欢迎交流提问