html中点击A超链接使其不跳转

今天在写一个javaScript中事件对象和事件冒泡的案例,发现事件冒泡的preventDefault()函数的作用是阻止事件默认属性,突发奇想,觉得可以用在html中点击A超链接使其不跳转

<a href="http://www.baidu.com" id="go">我是一个超链接(点击我不会跳转)</a>

<script type="text/javascript">
var aNode1 = document.getElementById('go');
aNode1.onclick = function(e){
//参数e表示事件对象,程序运行时,系统会自动传递一个事件对象进来,参数e就表示事件对象
	console.log(e, e.type, e.which);
	console.log(e.target, e.srcElement);
//阻止事件默认属性(即超链接不会跳转了,换言之就是阻止了超链接的默认跳转行为)
    e.preventDefault();
}
</script>

测试了一下,点击A超链接确实不会跳转了。

想要点击A超链接使其不跳转的方法还有很多,我这种写法只是突发奇想而已,而且我这种写法还有浏览器兼容的问题,IE浏览器估计不兼容,大家可以自己去测一测。

发布了622 篇原创文章 · 获赞 581 · 访问量 124万+

猜你喜欢

转载自blog.csdn.net/czh500/article/details/104553080