偶遇问题 - - JavaScript 取消链接默认行为问题
今天在测试《JavaScript DOM编程艺术(第2版)》中第69页代码时,遇到了问题。本来预期效果应该是点击链接后不跳转当前页面,而是另外弹出有个窗口。但结果却是页面跳转了。代码如下图所示:


经过一番询问与搜索后,发现问题出在"return false;"没有成功发挥其作用,所以没有取消链接的默认行为,将访问者带离了当前窗口。如果是如下图代码所写,其成功传达,那么结果就是想要实现的效果。



那这问题是怎么回事呢?(参见网址:a标签的取消默认行为 - SegmentFault http://segmentfault.com/q/1010000002993720)
有个小Demo如下。



好吧,问题是怎么回事搞清楚了,但怎么解决呢?网上说都是说用event.preventDefault();有的说的更详细一点的就是要区分IE浏览器与非IE浏览器,他们阻止默认行为有部分差异,IE的应该是window.event.returnValue == false;还有得加上event.stopPropagation();阻止冒泡行为。然而。。。。。。我试了又试,并没有一个成功实现了取消默认行为的。
所以,暂时我并没有找到可以在分离JavaScript的同时,还能成功完成取消链接默认行为的办法,现在只能在a标签中写上onclick=""。
这真是一个悲伤的结局(╥╯^╰╥)
2015.9.6
这个故事还没完~~峰回路转,在前端群遇到一个好心人指点,发现原来return false;是可以实现的取消链接默认行为的,我没能成功实现的原因在于要用闭包(你瞧,这就是“unknown unknown”我都不知道闭包的存在怎么能解决问题呢),详细请搜索——“for循环 绑定事件”。
不过虽然走在了正确的方向,我还是屡屡受挫,一度怀疑自己其实还是搞错了,后来用console才找到问题所在——注!意!拼!写!
(返回去看第二张图,有一个document和popUp写错了,我当时居然一点没发现)贴下成功实现的关键代码截图:

回顾这次问题,我觉得我最大的收获就是学习了console的一点使用来寻找bug,太感谢创造出console的人了!
偶遇问题 - - JavaScript 取消链接默认行为问题的更多相关文章
- JS 传播事件、取消事件默认行为、阻止事件传播
1.事件处理程序的返回值 通常情况下,返回值false就是告诉浏览器不要执行这个事件相关的默认操作.例如,表单提交按钮的onclick事件处理程序能通过返回false阻止浏览器提交表单,再如a标签的o ...
- day49—JavaScript阻止浏览器默认行为
转行学开发,代码100天——2018-05-04 今天主要说明一下通过JavaScript对浏览器默认行为的阻止操作.比如右键菜单的行为. 阻止默认行为的语句为: return false; 例如,阻 ...
- Javascript 获取链接(url)参数的方法
有时我们需要在客户端获取链接参数,一个常见的方法是将链接当做字符串,按照链接的格式分解,然后获取对应的参数值.本文给出的就是这个流程的具体实现方法. 当然,我们也可以用正则直接匹配,文章中也给出了一个 ...
- JavaScript禁止浏览器默认行为
JavaScript禁止浏览器默认行为 1.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&quo ...
- JavaScript函数的默认参数(default parameter)
JavaScript函数的默认参数(default parameter) js函数参数的默认值都是undefined, ES5里,不支持直接在形参里写默认值.所以,要设置默认值,就要检测参数是否为un ...
- idea-----怎样取消idea默认打开工程
怎样取消idea默认打开工程 引用:https://jingyan.baidu.com/article/656db918c05135e381249cb7.html
- javascript的阻止默认事件和阻止冒泡事件
这两个方面的知识,在妙味课堂中有听过,再次复习一下: 原文来自:[http://www.cnblogs.com/Essence/p/4266618.html] 事件冒泡与默认行为 在说事件冒泡之前 ...
- JavaScript停止事件冒泡和取消事件默认行为
功能:停止事件冒泡 function stopBubble(e) { // 如果提供了事件对象,则这是一个非IE浏览器 if ( e && e.stopPropagation ) { ...
- JavaScript阻止冒泡和取消事件默认行为
//功能:停止事件冒泡 function stopBubble(e) { if ( e && e.stopPropagation ) { e.stopPropagation(); } ...
随机推荐
- FILTER优化
explain plan for select a.* from fxqd_list_20131115_new_100 a where (acct_no, oper_no, seqno, trans_ ...
- 携手 Google 和 Docker 为 Microsoft Azure 带来全新的开源容器技术
发布于 2014-08-08 作者 陈 忠岳 今天对容器管理来说是个好日子.因为今天微软开放技术不止发布一项,而是两项开源计划来帮助云开发者将容器管理又向前推进一步.我们已开始与 Google ...
- 换成gnome3桌面后国际版qq不能输入中文问题
困扰了好久的问题今天终于解决了,网上也没有完整的教程,所以在这里整理下 前几天给自己的ubuntu装上了gnome桌面,一切都挺正常的,桌面很炫,用着也很舒服,不过之前的qq却没办法输入中文了,下面我 ...
- 在Openstack H版部署Nova Cell 时 ,终端输入nova service-list 和 nova host-list 命令将报错
关于Cell的基本介绍,可以参考贤哥的一篇文章: [OpenStack]G版中关于Nova的Cell http://blog.csdn.net/lynn_kong/article/details/8 ...
- hdu 4284 状态压缩
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4284 #include<cstdio> #include<cstring> # ...
- poj 1080 dp如同LCS问题
题目链接:http://poj.org/problem?id=1080 #include<cstdio> #include<cstring> #include<algor ...
- JavaScript函数柯里化的一些思考
1. 高阶函数的坑 在学习柯里化之前,我们首先来看下面一段代码: var f1 = function(x){ return f(x); }; f1(x); 很多同学都能看出来,这些写是非常傻的,因为函 ...
- HTTP协议介绍(SERVLET)
本文是servlet的入门篇,主要简单介绍下http协议 1.什么是HTTP _ 1.http协议:_1. 复杂解释: http(超文本传输协议)是一个基于请求与响应模式的.无状态的.应用层的协议 ...
- XML文件操作指南
一.XML简介 XML的全名是eXtensible Markup Language(可以扩展的标记语言),它的语法类似HTML,都是用标签来描述数据.HTML的标签是固定的,我们只能使用.不能修改: ...
- “发送至Onenote”惹来的小麻烦(转)
原文来自 : http://blog.csdn.net/yiyu_0417/article/details/7864172 [看到这篇文章,我觉得以后我也会遇到这个问题,很有价值我就先拷贝了,留着以 ...