阻止链接跳转(一)

href=”javascript:void(0);"含义

href=”javascript:void(0);”这个的含义是,让超链接去执行一个js函数,而不是去跳转到一个地址,
void(0)表示一个空的方法,也就是不执行js函数。

为什么要使用href=”javascript:void(0);”?

javascript:是伪协议,表示url的内容通过javascript执行。void(0)表示不作任何操作,这样会防止链接跳转到其他页面。这么做往往是为了保留链接的样式,但不让链接执行实际操作,

<a href="javascript:void(0)" onClick="window.open()">

点击链接后,页面不动,只打开链接

<a href="#" onclick="javascript:return false;">

作用一样,但不同浏览器会有差异。

href=”javascript:void(0);”与href=”#"的区别

<a href="javascript:void(0)">点击</a>

点击链接后不会回到网页顶部

<a href="#">点击</a> 

点击后会回到网页顶部

其实是包含了位置信息,例如默认的锚点是#top 也就是网页的上端
javascript:void(0) 仅仅表示一个死链接这就是为什么有的时候页面很长浏览链接明明是可是跳动到了页首
,而javascript:void(0) 则不是如此,所以调用脚本的时候最好用void(0)

使用javascript的方法

<a href="#" onclick="javascript:方法;return false;">文字</a>

<a href="javascript:void(0)" onclick="javascript:方法;return false;">文字</a>

补充<a href="javascript:方法;"这样点击a标签就可以执行绑定的方法了。

原文地址:https://www.cnblogs.com/echoing/p/9656849.html

时间: 2024-08-02 17:42:51

阻止链接跳转(一)的相关文章

阻止链接跳转(二)

有时我们会遇到这种需要在a标签上添加click事件,并且跳转前处理一些事务,因此需要做一些处理,看很多人会这样写 <a href="#">link</a>, 但是发现点击后页面返回了顶部,所以又出现了这样的写法等 <a href="###">link</a> 但这样并不兼容所有浏览器,有些浏览器就会出现很怪异的形为. 因此,这个问题还需要其它方法来解决. 方法一 <a href="javascript:

主攻ASP.NET.4.5.1 MVC5.0之重生:政府行政网站常用友情链接跳转javascript[干货分享]

<!-----------------------------------> <script language="JavaScript" type="text/JavaScript"> <!-- function MM_jumpMenu(targ, selObj, restore) { //v3.0 window.open(selObj.options[selObj.selectedIndex].value); if (restore)

页面链接跳转方法

一.window.location.href 是实现页面链接跳转 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>浏览器对象</title> <style> div{ width: 500px; margin:0 auto; } </style> </head> <

HTML阻止iframe跳转页面并使用iframe在页面内嵌微信网页版

昨天看到这篇文章[置顶]开源组件NanUI一周年 - 使用HTML/CSS/JS来构建.Net Winform应用程序界面 就想弄一个winform结合html5的一个小东西,突有兴致,想在里面嵌套一个微信网页版. 好了,想法一出来,就行动吧,最终效果如下图: 一开始就打算在页面里面嵌套一个iframe指向https://wx.qq.com就OK了,但是我还是太天真,微信网页版会自动跳转.结果如下图: 于是上网搜了一下阻止iframe跳转的办法,就是在iframe标签加上 security="r

Chrome 浏览器追踪链接跳转过程

网站开发时经常遇到需要追踪链接跳转是否正确的需求, 例如在浏览器输入一个链接 https://www.ryanzoe.top/git/how-to-revert-git 由于链接输入不完整,但是我有配置 301 跳转到完整的文章链接,所以最终地址栏显示的链接为 https://www.ryanzoe.top/git/how-to-revert-git-commit/ 如何查看链接跳转的过程 以下假设你使用的是 Chrome 浏览器 到 chrome web store 安装插件 link red

使用a链接时如何阻止超链接跳转

链接的onclick事件被先执行,其次是href属性下的动作,假设链接中同时存在href与onclick,如果想让href属性下的动作不执行,onclick必须得到一个false的返值 在用 <a href="" onclick=""> 时,出现了一些问题,困惑了我一个多月,现在从网友那边得到以下结论,让我豁然开朗,问题也迎刃而解. 链接的onclick事件被先执行,其次是href属性下的动作(页面跳转,或 javascript 伪链接): 假设链接中同

页面链接跳转历史URL不记录的兼容处理

1.阻止跳转a标签的链接 2.location.replace(href) 不生成新的历史记录, 但有bug 3.首先通过HTML5 history.replaceState()方法把当前URL地址替换成以个井号#结尾的目前链接地址: 4.执行location.replace('')刷新当前地址(此时#会忽略): (function(){ var fnUrlReplace = function (eleLink) { if (!eleLink) { return; } var href = el

第九章,WebView点击网页内链接跳转到其他Activity(Android)

在 AndroidManifest.xml中添加网络权限 <uses-permission android:name="android.permission.INTERNET"/> activity_main.xml <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com

6)HTML中a链接跳转地址怎么写

(1)看 thinkphp5的   附录--->助手函数  --->url 利用url进行书写地址跳转: 比如,你想跳转到cate控制器下的lst方法: <a href=" {:url(;cate/lst')} " >内容</a> 然后,你把鼠标放到页面的  内容  那个链接上,在页面的左下角就会有   地址显示出来,这样,你可以看到是不是你的想跳到的地址 那个ceshi.html代码展示: 1 <!DOCTYPE html> 2 <