浏览器的默认行为：JavaScript事件本身具有的属性，例如a标签的跳转，Submit按钮的提交，右键菜单，文本框的输入等。
阻止默认行为的方式：event.preventDefault(); event.returnValue = false; return false;
一、现象
先上代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>
</title>
</head>
<body>
<a href="">单击我</a>
<script type="text/javascript">
var oLink = document.getElementsByTagName("a")[0];
oLink.onclick = function(){
console.log("aaa");
}
</script>
</body>
</html>
运行后发现，单击文本后控制台并未输出“aaa”;
由于浏览器默认a标签进行跳转，a标签内并未添加实际网址，于是页面在单击后进行刷新，控制台无法进行有效（肉眼可见）的输出。
二、阻止默认行为的发生
三种方法
1、return false;
<script type="text/javascript">
var oLink = document.getElementsByTagName("a")[0];
oLink.onclick = function(){
console.log("aaa");
return false;
}
</script>
2、evt.returnValue = false;
<script type="text/javascript">
var oLink = document.getElementsByTagName("a")[0];
oLink.onclick = function(e){
var evt = e || event;
console.log("aaa");
evt.returnValue = false;
}
3、evt.preventDefault();
<script type="text/javascript">
var oLink = document.getElementsByTagName("a")[0];
oLink.onclick = function(e){
var evt = e || event;
console.log("aaa");
evt.preventDefault();
}
</script>
以上三种方法均可阻止默认行为的发生。
扫一扫
939
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
