阻止事件冒泡和默认到事件对象在不同浏览器中的传递

今天群里有一个同学发了一个问题,问题起因是他定义了一个drag函数,然后函数内部使用了e进行组织默认实践,结果在360浏览器正常运行但是火狐却报错,e不存在,第一时间有点懵,组织冒泡和组织默认一般都用,那里需要那里用,一般不会出现这种问题。因为新手才有这种操作,但是引发我兴趣,经过一番测试,我发现在360里面时间默认进行了传递,所以在360可以正常运行,但是在火狐里面没有进行传递。然后我传递参数为事件对象进去,执行成功,然后引发了我对几个浏览器不同引擎的猜测和测验。首先上代码,

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>

<form method="get" action="#">
<input type="submit" name="" id="button">
</form>

<script type="text/javascript" src="Jquery.js"></script>
<script type="text/javascript">
$("#button").click(function(e){
    drag()
})
function drag(ev) {
    var newEV=ev||window.event;
        newEV.preventDefault()
        alert("我前面都成功执行了")
}


</script>
</body>
</html>

这是问题代码,在Safari和Google下测试,成功执行了,但是在火狐和IE(ie炸了我不确定是我ie设置问题还是ie本身不能执行。知道的同学可以回复下)下失败了。修改代码,传入事件对象。

$("#button").click(function(e){
    drag(e)
})
function drag(ev) {
    var newEV=ev||window.event;
        newEV.preventDefault()
        alert("我前面都成功执行了")
}

 

所有浏览器都执行成功,(别问所有包不包括ie,ie下载都能失败),因为我将点击事件e作为drag的参数ev传入内部函数再执行。然后进行兼容检测,window.event处理兼容用的很多我就不多说,我这里讨论这个参数有没有用,改变nweEV=window.event,继续执行,然后在Safari和Google下成功组织的get请求,FF失败报错了,ie还在睡觉不能用,所以Safari和Google下事件对象是直接传到了drag里面,所以都成功了,但是FF里面我传入的e,最终执行的newEV却是window.event,所以显示newEV is undefined,这样就简单理解了。以上仅代表个人意见,有失误的地方希望可以提出共勉。

备注:ie睡醒后测试结果我补上,ie虐我千百遍,我待ie如不见就好了。

 

posted @ 2018-04-01 00:18  Rainy`  阅读(168)  评论(0编辑  收藏  举报