【JS】链接的href和onclick

最新推荐文章于 2020-05-26 10:30:26 发布
原创 最新推荐文章于 2020-05-26 10:30:26 发布 · 857 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#javascript

本文探讨了HTML中链接的onclick事件与href属性之间的执行顺序。通常情况下，点击链接时会先触发onclick事件，之后才会执行href定义的动作，如页面跳转等。若希望阻止href的默认行为仅执行onclick中的自定义函数，则需要在onclick中返回false。此外，还介绍了如何创建不会导致任何操作的伪链接。

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

链接的onclick事件先执行，其次是href属性下的动作（页面跳转，或 javascript 伪链接）。

如果不想执行href 属性下的动作执行，onclick动作需要要返回 false，即onclick=”youfun();return false;”


而伪链接为：<a href=”javascript:void(0)”>单此处什么也不会发生</a>

html标签中写onclick,HTML a 标签添加 onclick()事件的几种方式
weixin_39862097的博客
05-30 8060
1. 我们常用的在标签中添加点击事件的方法：a href="javascript:js_method();"备注：这种方法在传递this等参数的时候很容易出问题，而且javascript:协议作为a的href属性的时候，不仅会导致不必要的触发window.onbeforeunload事件，在IE里面更会使gif动画图片停止播放。W3C标准不推荐在href里面执行javascript语句2. 给hr...
HTML+JS基础之a标签href与onclick事件的冲突处理
SoulArbiter的博客
04-22 4607
这几天尝试一个小项目时遇到的一个很不明显的坑 感觉前端初学者都很容易掉进这个坑呀 就是在使用a标签中  如果同时有 href  和onclick事件时   如果没对 href 做处理 那么对 onclick 事件本身解析会有干扰 举个我今天遇到栗子： 在上面贴出的 code 中，因为我把这个链接设置成一个按钮  其目的是引发click_scroll函数 (页面滚动到指定位置) ，
js 重写a标签的href属性和onclick事件
weixin_30781775的博客
07-30 441
适应场景：假如移动端拨打电话，需要给a标签添加href属性，但是由于需求，需要链接跳转的同时给a标签添加onclick事件，如果不做任何处理的话，默认执行点击事件，而不会跳转href属性的链接。 怎么解决：重写a标签的href属性和onclick事件 //这段代码可放入点击事件里 (function(){ this.fnCancel(); var _event_list = {}; ...
<a>标签中 href 和 onclick 的区别，以及href="javascript:xxx(this);"与onclick="xxx(this);" 传递this参数的区别
有范管理美学 | 公众号/头条号：有范管理美学
08-18 3万+
标签中href属性动作和onclick事件的区别，以及href="javascript:xxx(this);"与onclick="xxx(this);" 传递this参数的区别 一、href 与 onclick 的区别 我以前在写标签的 href 和 onclick 一直很随意，后来出过几次问题，以后才开始重视这个问题： 首先摘录一篇文
每周学点js_<a>的href和onlick
11-09 1665
在博客中新加了分类，
Html A标签中 href 和 onclick用法、区别、优先级别
MyDriverC
03-07 2万+
如果不设置 href属性在IE6下面会不响应hover。双击后会选中标签的父容器而非这个一a标签（IE下都存在这一问题）。  代码如下 复制代码 假定我们有个fn方法，需要取到这个元素，第一个方法传入的this是空值。 所以，比较推荐的写法是  代码如下 复制代码 javascript:void
A标签中通过href和onclick传递的this对象实现思路
12-03
当涉及到在`<a>`标签上同时使用`href`属性和`onclick`事件时，`this`对象的行为可能会变得复杂，特别是在想要传递当前元素引用给一个处理函数时。本文将详细解释这个问题，并提供解决思路。 首先，`this`关键字在...
a标签的href和onclick 的事件的区别介绍
09-05
值得注意的是，如果`onclick`中的JavaScript函数返回`false`，那么`href`指定的链接将不会被加载，这为阻止默认行为提供了可能。 例如： ```html <a href="https://example.com" onclick="alert('你点击了链接！');...
详解Html a标签中href和onclick用法、区别、优先级别
08-31
综上所述，`href`和`onclick`在`<a>`标签中分别负责链接跳转和JavaScript交互。在设计交互时，要根据需求选择合适的属性，并注意事件处理的顺序和阻止默认行为，以确保在不同浏览器中保持一致的行为。在需要传递`...
a标签的href与onclick事件的区别详解
12-09
也就是说，用户点击链接后，首先会触发`onclick`绑定的JavaScript函数，执行完毕后再执行`href`指定的动作，如页面跳转或者执行JavaScript代码。 2. **阻止默认行为**： 如果希望在`onclick`执行后阻止`href`的...
超链接中的onclick和href链接方法
hahhahahaa的博客
09-04 7080
链接的 onclick 事件被先执行，其次是 href 属性下的动作（页面跳转，或 javascript 伪链接）； 假设链接中同时存在 href 与 onclick，如果想让 href 属性下的动作不执行，onclick 必须得到一个 false 的返回值。不信，你可以将 goGoogle 函数中的 return false 注释掉； 如果页面过长有滚动条，且希望通过链接的 onclick ...
JS异常处理：Uncaught TypeError: xxx is not a function at HTMLAnchorElement.onclick
热门推荐
有范管理美学 | 公众号/头条号：有范管理美学
01-09 7万+
JS异常处理：Uncaught TypeError: xxx is not a function at HTMLAnchorElement.onclick  ---- 关于标签调用onclick中的方法无效的原因 今天在优化别人写的代码时，出了个错误。 原代码如下，我想把href属性函数改为onclick事件 a href="javascript:search();
<a>标签href与js(onclick)的触发顺序
华仔的逆袭的专栏
12-22 8084
在前端标签<a> 的执行过程中遇到问题，发现了href与js(onclick)的触发是存在先后顺序的。 优先级：onclik > href 如果不需要href的跳转可以使用event.preventDefault() 方法置于onclick函数中。 如果只是把<a> 作为按钮使用可以使用href="javascript:void(0);"。<a href="index" onclick="to
<a>标签中的onclick和href属性
zyb2017的博客
10-18 1951
顺序1.onclick和href的执行顺序 代码：//会先执行jump()方法，然后执行href跳转到login.html页面 <a href="login/login.html" onclick = "jump();">点击跳转到login页面</a>判断跳转1.在jump中添加判断//通过event.preventDefault取消跳转 <a href="login/login.html" o
在onclick或者href直接写js脚本
Turbo
05-26 3681
比如用在直接刷新当前页面 第一种 <span class="layui-btn" onclick="javascript:location.reload()">刷新</span> 第二种 <span class="layui-btn" onclick="javascript:location.replace(location.href)">刷新</span>
js模拟点击a标签，触发href
巴达的博客~
10-25 6万+
js中的$(...).click()事件只能触发绑定的onClick方法，不能跳转到href。 常规情况下如果想下如果想在js里跳转href的链接，会先用attr获取到href属性的值，然后window.location.href跳转，但是现在想利用a标签的download属性实现下载功能，如果先获取href属性再跳转很多浏览器（例如Chrome）会直接打开mp3之类的文件，无法实现下载。
js onclick的节点参数传输
飞空静渡
06-28 1563
&lt;html&gt; &lt;body&gt; &lt;h3 id="title" onclick="titleclick(this)"&gt; hello world&lt;/h3&gt; &lt;script&gt; function titleclick(e) { document.getElementById(e.id).innerHTML = &qu
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值