关于 javascript:void(0) 的使用
在 Wep App 中,我们经常需要在 JavaScript 中处理链接的点击。因此,我们希望用户点击 <a> 元素时阻止它的默认行为。此时我们可以用很多不同的方法来处理。例如:
<a href="#">Click Me</a>
<a href="#" onclick="return false">Click Me</a>
<a href="javascript:void(0);">Click Me</a>
<a href="javascript:void 0;">Click Me</a>
<a href="javascript:;">Click Me</a>
<a href="javascript:">Click Me</a>
第一种方法最简单,但是它会导致点击时页面滚动到页首。因此第二种方法利用 return false 语句阻止默认行为的执行。后面几种方法利用 javascript: URI 来达到页面不跳转的效果:按照规定,只要 javascript 代码执行的结果不为 undefined,则页面不跳转。因此第三、四种方法利用了 void 操作符的返回值是 undefined 的特点,而最后两种方法直接利用空语句的返回值为 undefined 的原理。
但是后面四种方法在 IE 中使用可能会有副作用:在 IE 中点击该链接会触发 window.onbeforeunload 事件(即使 IE9 也是这样的)。因此,如果你绑定了这个事件的处理程序,需要考虑这个问题。
参考资料:
[1] void - JavaScript | MDN
[2] href=“javascript:” vs. href=“javascript:void(0)”
关于 javascript:void(0) 的使用的更多相关文章
- js中 javascript:void(0) 用法详解
点击链接不做任何事情: <a href="#" onclick="return false">test</a> <a href=& ...
- html 空链接 href="#"与href="javascript:void(0)"的区别
#包含了一个位置信息 默认的锚是#top 也就是网页的上端 而javascript:void(0) 仅仅表示一个死链接 这就是为什么有的时候页面很长浏览链接明明是#但跳动到了页首 而javascrip ...
- a href=#与 a href=javascript:void(0) 的区别
a href="#"> 点击链接后,页面会向上滚到页首,# 默认锚点为 #TOP <a href="javascript:void(0)" onCl ...
- href使用 javascript:;与javascript:void(0)防跳到顶部
有时候我们在编写js过程中,需要触发事件而不需要返回值,那么就可能需要这样的写法 href=”#”,包含了一个位置信息.默认的锚是#top,也就是网页的上端,当连续快速点击此链接时会导致浏览器巨慢 ...
- javascript:void(0)
这是不是一个设计缺陷呢 void(0)这种用法巧妙利用void关键字的特性返回undefined(且没有副作用).因为不是关键字,比如直接使用undefined,内容可能被改写. 再来看为啥使用0,而 ...
- <a href=”#”>与 <a href=”javascript:void(0)” 的区别
<a href=”#”>中的“#”其实是锚点的意思,默认为#top,所以当页面比较长的时候,使用这种方式会让页面刷新到页首(页面的最上部) javascript:void(0)其实是一个死 ...
- 超级链接a中javascript:void(0)弹出另外一个框问题
转字:http://my.oschina.net/castusz/blog/68186 结果在IE.Firefox.Chrome都是先执行的onclick事件,在项目中我们尽量不要同时使用这两种方式. ...
- javascript:void(0) ,设置a链接无效,设置点击a页面不刷新,不跳动
http://www.cnblogs.com/opper/archive/2009/01/12/1373971.html 我想使用过ajax的都常见这样的代码: <a href="ja ...
- IE6与 javascript:void(0)
遇到过几次这种问题,现在总结一下. 代码: <a onclick="window.location.href='http://www.google.com'" href=&q ...
- 超链接的#和javascript:void(0)的区别
转载于:http://www.uw3c.com/cssviews/css12.html 在工作中,如果我们想把a标签中的链接置成空链接,我们一般会用两种方法: 1 <a href=" ...
随机推荐
- Android:调试之LogCat
通过 Logcat 查看: 常用的Log有5个:Log.v().Log.d().Log.i() .Log.w(). Log.e(). Log.i( "类":"函数名&qu ...
- php Ajax 局部刷新
php Ajax 局部刷新: HTML部分 </head> <body> <h1>Ajax动态显示时间</h1> <input type=&quo ...
- 关于fedora下jdk的安装
http://zhumeng8337797.blog.163.com/blog/static/1007689142012472620637/ alternative命令 http://blog.csd ...
- 理解extern char s[100]与extern char *s
在x.c中定义了一个字符数组 char s[100],在l.c中进行引用extern char s[200], 有些c程序新手经常把它写成extern char *s. 这两种写法的含义一样吗? 首先 ...
- Complete The Pattern #6 - Odd Ladder
Complete The Pattern #6 - Odd Ladder Task: You have to write a function pattern which creates the fo ...
- poj3067
求交点的个数: 容易发现,对于两条航线(xi,yi)和(xj,yj),设xi<xj 只有yi>yj时两条航线存在交点: 于是我们考虑以x为第一关键字减序,y为第二关键字为减序排序: 则对于 ...
- echarts 问题2
加载图表的区域div必须单独给定class,此样式中必须还有宽和高,不然图表出来之后会有这样那样的问题
- 架构版本与 NuGet 的版本不兼容 解决方案
VS的NuGet管理在大大提高了开发效率,一直都在使用但今天在遇到了一个问题,引用一个所需要的NuGet包VS缺提示如下错误
- Cookie设置HttpOnly,Secure,Expire属性
在eclipese中创建Web工程时,有个dynamic web module version选项,首先解释下这个选项的意思: http://stackoverflow.com/questions/3 ...
- 实现类似QQ的即时通信程序(十一)
此为网络编程的一个系列,后续会把内容补上....