href =“javascript:”vs. href =“javascript:void(0)”
我们的networking应用程序完全在浏览器上呈现。
服务器只通过JSON消息传递给浏览器。
因此,我们只需要一个页面的应用程序,大多数<a>
标签没有一个真正的href
指向其他页面。
在我寻求删除不必要的东西时,我想知道是否可以摆脱我们代码中的void(0)
的无数次,因为它们看起来没有用处:
<a onclick="fn()">Does not appear as a link, because there's no href</a> <a href="javascript:void(0)" onclick="fn()">fn is called</a> <a href="javascript:" onclick="fn()">fn is called too!</a>
有谁知道如果使用href="javascript:"
可以导致一个问题?
它甚至在IE7上工作…
请不要花你宝贵的时间来告诉我内联的JavaScript是不好的,因为这是由模板引擎生成的:)
这不会导致问题,但是这与PreventDefault
当你在页面中停下来,并锚定为:
<a href="#" onclick="fn()">click here</a>
你会跳到顶部,URL也会有锚点#
,为了避免这种情况,我们只需return false;
或者使用javascript:void(0);
关于你的例子
<a onclick="fn()">Does not appear as a link, because there's no href</a>
只是做a {text-decoration:underline;}
你会有“链接像”
<a href="javascript:void(0)" onclick="fn()">fn is called</a> <a href="javascript:" onclick="fn()">fn is called too!</a>
没关系,但在你的function
结束时,只需return false;
为了防止默认行为,你不需要再做任何事情。
当使用javascript:
导航时,执行的脚本的返回值(如果有的话)成为浏览器中显示的新文档的内容。 JavaScript中的void
操作符会导致expression式的返回值返回undefined ,从而阻止此操作的发生。 您可以自己尝试,将以下内容复制到地址栏并按回车:
javascript:"hello"
结果是只有单词“你好”的新页面。 现在将其更改为:
javascript:void "hello"
…什么都没发生。
当你编写javascript:
它自己没有脚本被执行,所以脚本执行的结果也是未定义的 ,所以浏览器什么都不做。 这使得以下几乎等同于:
javascript:undefined; javascript:void 0; javascript:
除了可以通过声明具有相同名称的variables来覆盖undefined外。 使用void 0
通常是毫无意义的,它基本上已经从void functionThatReturnsSomething()
删除了。
正如其他人所说,最好还是使用return false;
在点击处理程序中使用javascript:
协议。
使用'javascript:void 0'会在IE中造成问题
当你点击这个链接的时候,它会触发onbeforeunload事件的窗口!
<!doctype html> <html> <head> </head> <body> <a href="javascript:void(0);" >Click me!</a> <script> window.onbeforeunload = function() { alert( 'oops!' ); }; </script> </body> </html>
在所有浏览器中,这个方法似乎都可以,如果你使用jQuery事件来设置onclick:
<a href="javascript:;">Click me!</a>
如前所述,如果使用History(或ba-bbq)JS插件,可以使用href =“#”更改url散列,并可以触发数据重新加载。
你可以让他们都成为现实。
您将需要添加return false;
到任何被称为onclick的函数的结尾,都没有页面跳到顶端。
我通常不使用任何href和改变与CSS的方面,使他们似乎链接。 因此,除了应用程序的事件处理程序之外,您不必担心链接效应
a { text-recoration: underline; cursor: pointer; }
为什么所有的点击事件都作为a href
链接?
如果你使用span
标签 :hover
CSS和适当的onclick事件,这将彻底解决这个问题。