javascript a标签href点击不进行跳转的解决办法

原创 已于 2023-09-06 13:54:53 修改
· 1.1w 阅读 · 8 ·
版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#前端

于 2020-10-16 14:20:56 首次发布
本文介绍了解决JavaScript中a标签href跳转失效的两种常见方法：一是添加随机参数以避免浏览器误判，二是利用onclick事件直接控制页面跳转。适用于遇到类似问题的开发者。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

javascript a标签href点击不进行跳转的解决办法

a标签的href 跳转失效的问题

在这里插入图片描述
在这里插入图片描述

我找到两个解决办法：记录如下：

1. 在你的URL最后添加一个随机的参数，这样写的原因，是可能浏览器认为你需要跳转的URL与当前页面的URL是一样，所以加上随机参数，能够解决（但是这个方案对我的问题不管用，但是放出来，或许能帮到一些人）

2. 舍弃href属性，在<a>标签中使用onclick方法：οnclick="window.location = 'URL' ",href:“###”，完美解决问题。

a标签href不跳转_《HTML常用标签》
weixin_39837727的博客
12-29 1301
1.a 标签的用法（1）定义和用法 a标签定义超链接（用于从一张页面链接到另一张页面）或锚（用于从页面当前位置跳转至指定锚点），它最重要的属性是 href 属性，指示链接的目标。所有浏览器都支持 a 标签。（2）常用属性 hreftargetdownloadrel=noopener （3）href具体用法： <a href="">空链接，当前页面跳转，刷新页面&l...
A标签触发onclick事件而不跳转的多种解决方法
09-05
然而，有时我们可能只需要A标签触发一个JavaScript事件，而不想让它执行默认的跳转行为。在这种情况下，我们需要采取措施来阻止A标签的默认跳转。以下是四种常见的解决方法： 1. **不用A标签，用CSS或JavaScript...
<a>标签不跳转的几种实现方式
杂物堆
04-22 4128
刚刚看了一个实例，需要用到a标签中的href的值，但是不需要跳转，但是这个实例中没有取消href的跳转功能，所以查了下应该怎么实现。 1、onclick事件中返回false<a href="http://www.baidu.com" onclick="return false" >不能跳到百度</a> 2、 用href=”javascript:void(0)”这种伪协议；（这种伪协议，少写的好）
单击a标签不跳转的设置，a标签更多设置说明
couragehope的博客
09-03 1万+
https://blog.csdn.net/wxl1555/article/details/53897841 一、让a标签点击后不跳转可以设置成 1.&lt;a href="javascript:void(0);" &gt;javascript:void(0);&lt;/a&gt;  2.&lt;a href="javascript:;" &gt;javascript:;&lt;/a&gt;  ...
Vue 中 a标签上href无法跳转的解决方式
10-16
今天小编大家分享一篇Vue 中 a标签上href无法跳转的解决方式，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
html中点击A超链接标签使其不跳转
一只苟延残喘的卑微蝼蚁
06-08 2万+
html中点击A标签使其不跳转&lt;a href="#"&gt;&lt;/a&gt;有一个缺点，如果页面很长的话，会跳到本页面的顶部，有点像是跳到了一个新页面的感觉，体验不是很好！&lt;a href="#" onclick="return false"&gt;&lt;/a&gt;&lt;a href="javascript:void(0)"&gt
【JS】实现 a 标签点击不跳转
qq_45677671的博客
06-02 2313
js 实现 a 标签点击不跳转
a标签href不跳转
宅即万物
10-24 7684
标签属性href，使其指向空或不返回任何内容。如： &lt;a href="javascript:void(0);" &gt;点此无反应javascript:void(0)&lt;/a&gt; &lt;a href="javascript:;" &gt;点此无反应javascript:&lt;/a&gt; 标签事件onclick，阻止其默认行为。如： &lt;a href
a标签href不跳转几种方式
L_JLJL的博客
05-03 5440
标签属性href，使其指向空或不返回任何内容。如：&lt;a href="javascript:void(0);" &gt;点此无反应javascript:void(0)&lt;/a&gt;&lt;a href="javascript:;" &gt;点此无反应javascript:&lt;/a&gt;原理: void 操作符指定超级链接标签事件onclick，阻止其默认行为。如：&lt;a hre
ajax动态为a标签href赋值不执行跳转的原因分析及解决
10-27
总结来说，本文分析了通过AJAX动态为a标签href属性赋值时遇到页面不跳转的问题，并给出了将AJAX设置为同步来解决此问题的方法。然而，推荐的解决策略是在AJAX请求的回调函数中处理页面跳转逻辑，这样既可以确保页面...
html超链接a标签的href跳转跟onclick之间执行顺序示例介绍
09-28
`href`属性是`<a>`标签的核心，它定义了链接的目标URL，当用户点击链接时，浏览器通常会立即跳转到这个URL所指定的页面。然而，`<a>`标签还可以与`onclick`事件结合，为用户提供更复杂的交互体验。 `onclick`事件是...
IE6中链接A的href为javascript协议时不在当前页面跳转
10-25
例如，在本例中，当我们在IE6中的链接元素（A标签）使用javascript协议作为href属性值时，无法实现与在其他浏览器中相同的页面跳转行为。这个问题的解决方法需要考虑到IE6的历史行为和已知的兼容性问题。 首先，...
前端基础之HTML总结（一）
qiuqiudongdong的博客
10-04 504
HTML 一、 网页的结构： 一个网页由三部分组成： 结构 结构是页面的整体结构，哪里是标题，哪里是段落，哪里是图片。 结构使用HTML来编写。 表现 表现是页面的外在的样式，比如字体，字体大小，字体颜色，背景等等。 使用CSS来设置页面中元素的样式。 行为 页面和用户之间的交互行为。 使用JavaScript来设置页面的行为。 一般网页要求结构、表现、行为三者分离 在开发中面临一个问题—程序之间的耦合，三者分离就是为了解耦合 二、HTML，超文本标记语言。 三、负责页面中的结构，定义出页面中的
a href 不让页面跳转
李厂长的自留地
11-22 3万+
修改
css 中＜a＞标签的href属性添加空值（不跳转）的三种方法
最新发布
weixin_72940349的博客
08-11 575
#前端#css
a标签实现不跳转点击
weixin_33842304的博客
11-10 306
<a class="tiao" href="./index.php"></a> JS实现无跳转a标签 <script type="text/javascript"> $(".tiao").click(function (){ return false; }) </script> 转载于:...
a标签不跳转的三种方法
qq_40436793的博客
08-03 1万+
onclick时间返回false <a href="https://www.baidu.com" onclick="return false">a标签不跳转</a> 用href伪协议； 写法一：最常用的方法，也是最周全的方法，void是一个操作符，void(0)返回undefined，地址不发生跳转。 <a href="javaScript:void(0);">a标签不跳转</a> 写法二：这种写法跟写法一类似，区别只是执行了一条空的js代码..
链接中javascript: void(0)的使用介绍
yuanmei1986的博客
02-23 1425
最近看了好几个关于标签和javascript：void(0)的帖子，谨记于此，以资查阅。  注：以下代码未经全面测试，但每一种方法可能会出现的情况都基本做了说明。  在做页面时，如果想做一个链接点击后不做任何事情，或者响应点击而完成其他事情，可以设置其属性 href = "#"，但是，这样会有一个问题，就是当页面有滚动条时，点击后会返回到页面顶端，用户体验不好。  目前有如下几种解决
vue——实现组织架构图(vue-org-tree)——技能提升
热门推荐
yehaocheng520的博客
08-13 3万+
关于组织架构图，效果图如下： 之前我是用jq写过一个组织架构图，文章链接如下：当时是用的jOrgChart jq版本的组织架构图：https://blog.csdn.net/yehaocheng520/article/details/117379214?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522162883781016780264023604%2522%252C%2522scm%2522%253A%252220140713.13010
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

叶浩成520

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值