【JS】链接的href和onclick

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

#javascript

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

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

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


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

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交互。在设计交互时，要根据需求选择合适的属性，并注意事件处理的顺序和阻止默认行为，以确保在不同浏览器中保持一致的行为。在需要传递`...
js 重写a标签的href属性和onclick事件
weixin_30781775的博客
07-30 451
适应场景：假如移动端拨打电话，需要给a标签添加href属性，但是由于需求，需要链接跳转的同时给a标签添加onclick事件，如果不做任何处理的话，默认执行点击事件，而不会跳转href属性的链接。 怎么解决：重写a标签的href属性和onclick事件 //这段代码可放入点击事件里 (function(){ this.fnCancel(); var _event_list = {}; ...
html标签中写onclick,HTML a 标签添加 onclick()事件的几种方式
weixin_39862097的博客
05-30 8118
1. 我们常用的在标签中添加点击事件的方法：a href="javascript:js_method();"备注：这种方法在传递this等参数的时候很容易出问题，而且javascript:协议作为a的href属性的时候，不仅会导致不必要的触发window.onbeforeunload事件，在IE里面更会使gif动画图片停止播放。W3C标准不推荐在href里面执行javascript语句2. 给hr...
<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 1689
在博客中新加了分类，
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事件的区别详解
12-09
也就是说，用户点击链接后，首先会触发`onclick`绑定的JavaScript函数，执行完毕后再执行`href`指定的动作，如页面跳转或者执行JavaScript代码。 2. **阻止默认行为**： 如果希望在`onclick`执行后阻止`href`的...
HTML+JS基础之a标签href与onclick事件的冲突处理
SoulArbiter的博客
04-22 4654
这几天尝试一个小项目时遇到的一个很不明显的坑 感觉前端初学者都很容易掉进这个坑呀 就是在使用a标签中  如果同时有 href  和onclick事件时   如果没对 href 做处理 那么对 onclick 事件本身解析会有干扰 举个我今天遇到栗子： 在上面贴出的 code 中，因为我把这个链接设置成一个按钮  其目的是引发click_scroll函数 (页面滚动到指定位置) ，
超链接中的onclick和href链接方法
hahhahahaa的博客
09-04 7173
链接的 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 8117
在前端标签<a> 的执行过程中遇到问题，发现了href与js(onclick)的触发是存在先后顺序的。 优先级：onclik > href 如果不需要href的跳转可以使用event.preventDefault() 方法置于onclick函数中。 如果只是把<a> 作为按钮使用可以使用href="javascript:void(0);"。<a href="index" onclick="to
<a>标签跳转和执行js函数，href和onclick属性
记忆力不好的博客
07-12 2万+
链接的onclick 事件被先执行，其次是href属性下的动作（页面跳转，或 javascript 伪链接）； 假设链接中同时存在href 与onclick，如果想让href 属性下的动作不执行，onclick 必须得到一个false的返回值； 如果页面过长有滚动条，且希望通过链接的 onclick 事件执行操作。应将它的 href 属性设为 javascript:void(0);，而不要是 #，
js中重写a标签的href属性和onclick事件
yangrenjunjiayou的博客
04-28 1万+
重写a标签的href属性和onclick事件
js模拟点击a标签，触发href
巴达的博客~
10-25 6万+
js中的$(...).click()事件只能触发绑定的onClick方法，不能跳转到href。 常规情况下如果想下如果想在js里跳转href的链接，会先用attr获取到href属性的值，然后window.location.href跳转，但是现在想利用a标签的download属性实现下载功能，如果先获取href属性再跳转很多浏览器（例如Chrome）会直接打开mp3之类的文件，无法实现下载。
js onClick 事件跳转链接
最新发布
08-21
在 JavaScript 中，使用 `onClick` 事件实现页面跳转是一种常见的做法，可以通过内联事件处理或脚本绑定的方式实现。以下是一些具体实现方式： ### 1. 使用 `window.location.href` 实现跳转 通过 `window.location...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值