关于鼠标当中的事件绑定
关于鼠标中间的事件绑定
window.onload = function() {
if(document.attachEvent){
document.attachEvent('onmousewheel', stopDefault);
} else if (document.addEventListener) {
document.addEventListener('DOMMouseScroll',stopDefault,false);// 这句貌似没绑上
}
};
function stopDefault(e) {
if(e && e.preventDefault) {
e.preventDefault();
} else {
window.event.returnValue = false;
}
return false;
}
上述代码在Chrome中无效...
求教育
------解决方案--------------------
这个情况可能比我们理解的要复杂一点，chrome不支持DOMMouseScroll支持mousewheel，但他又支持addEventListener，不支持attachEvent。根据上面的规律，只能这样绑定了。
window.onload = function() {
if(document.attachEvent){
document.attachEvent('onmousewheel', stopDefault);
} else if (document.addEventListener) {
document.addEventListener('DOMMouseScroll',stopDefault,false);// 这句貌似没绑上
}
};
function stopDefault(e) {
if(e && e.preventDefault) {
e.preventDefault();
} else {
window.event.returnValue = false;
}
return false;
}
上述代码在Chrome中无效...
求教育
------解决方案--------------------
这个情况可能比我们理解的要复杂一点，chrome不支持DOMMouseScroll支持mousewheel，但他又支持addEventListener，不支持attachEvent。根据上面的规律，只能这样绑定了。
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
#div{ width:1000px; height:2000px;background: #f1f1f1;}
</style>
</head>
<body>
<div id="div" style="height: 2000px;"></div>
<script type="text/javascript">
window.onload = function() {
function addEvent(obj, type, fn){
if(obj.addEventListener){
obj.addEventListener(type, function(){
fn.call(obj);
}, false);
} else if(obj.attachEvent){
obj.attachEvent('on' + type, fn);
}
}
onMouseWheel(document.getElementById('div'));
function onMouseWheel(obj){
addEvent(obj, 'mousewheel', fn); // ie, chrome
obj.addEventListener('DOMMouseScroll', fn, false); // ff
}
function fn(e){
e = e
------解决方案--------------------
event;
if(e.preventDefault){
e.preventDefault();
} else {
e.returnValue = false;
}
return false;
}
};
</script>
</body>
</html>