在前几天的项目中，场景值如下：
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; }
跳动状态如下图
如有疑问，欢迎交流提问
