<a>标签的中既有href属性又有onclick属性

最新推荐文章于 2023-05-31 17:18:59 发布

AVAJ99

最新推荐文章于 2023-05-31 17:18:59 发布

阅读量917

点赞数

CC 4.0 BY-SA版权

文章标签： javascript 测试

本文链接：https://blog.youkuaiyun.com/SvFox99/article/details/7712669

本文探讨了<a>标签中href和onclick属性的使用方式及其执行顺序，通过实例展示了当onclick事件中返回false时，href将不再生效的现象。

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

无意间发现<a>标签的写法：<a href="###.do" title="#" target="_blank" onclick="saveHistory(this)">####</a>

由于自己没有这样写过，就想了一下，href和onclick干嘛要一起写了，这样写了以后到底哪个起作用了，或先后顺序是什么？

然后就简单的写了一下用于测试：

结果：

他们都起了作用，且有先后顺序。

先onclick,后href.且当onclick事件中如果return fase;则href就不起作用了。

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

AVAJ99

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

vue基础语法01

m0_67514201的博客

08-05

324

v-model：用来在 input、select、textarea、checkbox、radio 等表单控件元素上创建双向数据绑定，根据表单上的值，自动更新绑定的元素的值。v-show：与v-if类似，只是会渲染其身后表达式为false的元素，而且会给这样的元素添加css代码：style="display:none"相同点：computed和watch 都是以vue的依赖追踪为基础的，都是希望当依赖发生改变的时候，发生改变；v-else上一个兄弟元素必须是v-if或者是v-else-if。...

vue基础之事件v-onclick=”函数”用法示例

12-01

本文实例讲述了vue基础之事件v-onclick=函数用法。分享给大家供大家参考，具体如下： v-on:click/mouseout/mouseover/dblclick/mousedown….. 事件: v-on:click=”函数” v-on:click/mouseout/mouseover/dblclick/mousedown….. new Vue({ el:'#box', data:{ //数据 arr:['apple','banana','orange','pear'], json:{a:'apple',b:'banana',c:'orange'} }

参与评论您还未登录，请先登录后发表或查看评论

a标签href和onclick事件同时写导致的问题

dczjn9698的博客

04-10

423

项目中用到了base标签，然后在下面又写了a标签，每次点过A标签后，都会跳转到base下的路径。后来查明是A标签href和onclick同时用导致的。 W3C中base标签用法如下：定义和用法 <base> 标签为页面上的所有链接规定默认地址或默认目标。通常情况下，浏览器会从当前文档的 URL 中提取相应的元素来填写相对 URL 中的空白。使用 <bas...

a标签 href和点击事件同时存在

触不到的颜色是否叫彩虹的博客

02-23

2786

http://bbs.youkuaiyun.com/topics/392188997 <a href="http://mp.blog.youkuaiyun.com/mdeditor" target="_blank" onclick="return externalLinksConfirm(this)">csdn</a> function externalLinksConfirm(t){...

html a标签中 href 和 onclick 同时使用的问题优先级别

mengzuchao的专栏

07-17

5351

Html A标签中 href 和 onclick 同时使用的问题优先级别 1 顺序 ie 6 : href 先触发 onclick 后触发其他浏览器先触发onlick 后触发 href 2 href="javascript: xxx()" 不能传入this作为参数 onclick可以代码如下 <a href="javascript:alert('href event'...

火狐FIREFOX使用a标签下载文件，欲同时使用href和onclick事件，onclick事件无效的解决方法

小菜鸡程序媛的挣扎史

12-30

1555

因为火狐的兼容性问题，在想要点击a标签下载文件，同时对它添加点击事件记录下载次数时，会出现只有href属性生效，onclick内的函数无效的现象。在网上找了很多方法都无法解决，无法同时使用href和onclick属性。 <a href="url" @onclick="count(id)">下载</a> count(id) { updateCount(id)...

ie6下a标签的onclick事件不执行问题解决方案

09-25

在IE6中，当`<a>`标签的`href`属性被设置为`javascript:void(0)`或者空字符串时，浏览器会尝试阻止默认的页面跳转行为，以便执行`onclick`事件中的JavaScript代码。然而，IE6的事件处理机制并不完善，它有时无法正确...

a标签的href和onclick 的事件的区别介绍

09-05

`href`和`onclick`都是与`<a>`标签交互相关的属性，但它们的作用和执行顺序有所不同，理解这些差异对于优化用户体验和控制页面行为至关重要。首先，`href`属性是`<a>`标签的核心属性，它定义了链接的目标地址。当...

怎么才可以让点击<a>标签后无任何反应

最新发布

05-13

在 `<a>` 标签的 `onclick` 属性中直接返回 `false`，既能阻止默认行为（链接跳转），又能阻止事件冒泡。 **代码示例**： ```html <a href="https://example.com" onclick="return false;">点击我（无反应）</a> ``...

ajax动态为a标签href赋值不执行跳转的原因分析及解决

10-27

本文将探讨如何动态为a标签的href属性赋值，并分析为什么有时候这种方式并不触发页面跳转的深层原因，同时提供相应的解决策略。首先，要理解AJAX的异步特性是问题的关键所在。在使用jQuery等JavaScript库进行AJAX...

<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <link href="/layui/css/layui.css" rel="stylesheet"> <script src="./js/jquery-3.4.1.min.js" type="text/javascript" charset="utf-8"></script> <script src="./layui/layui.js" type="text/javascript" charset="utf-8"></script> </head> <body> <div class="layui-container" style="margin-top: 100px;"> <form class="layui-form"> <div class="layui-form-item"> <label class="layui-form-label">账号</label> <div class="layui-input-block"> <input type="text" name="username" required lay-verify="required" class="layui-input"> </div> </div> <div class="layui-form-item"> <label class="layui-form-label">密码</label> <div class="layui-input-block"> <input type="password" name="password" required lay-verify="required" class="layui-input"> </div> </div> <button type="button" class="layui-btn" onclick="login()">登录</button> </form> </div> <script type="text/javascript"> function login() { $.ajax({ url: 'http://localhost:8085/login/user', type: 'POST', contentType: 'application/json', data: JSON.stringify({ username: $('input[name="username"]').val(), password: $('input[name="password"]').val() }), success: function(res) { if(res.code === 200) { localStorage.setItem('user', JSON.stringify(res.data)); location.href = 'exam-list.html'; } } }); } </script> </body> </html> 前端代码在输入框加入正则匹配必须10位数

03-19

原来的lay-verify="required"需要改为lay-verify="required|username"，这样既保留必填验证，又加入新的规则。同时，需要在JavaScript部分初始化LayUI的表单模块，并定义这个验证规则。这可以通过layui.use('form'...

VUE中<a>标签里调用v-on:click发送axios请求

热门推荐

m0_37983475的博客

10-19

1万+

主要用于实现下载、导出功能。后端传递流，而不是blob对象。 <a>标签的href不为false，且绑定的click向后台发送axios请求实现。这里使用@click不启作用。调用顺序为先click后跳转链接。 href填写的是后端传递流的url 例子： html部分： <a class="el-button--primary" href="www.baidu.com" v...

vue拼接html中a标签 onclick触发方式，并且使用post请求跳转

qq_43086723的博客

05-31

2237

vue拼接html中a标签 onclick触发方式，并且使用post请求跳转

html A标签的onclick事件和href的使用

weixin_34219944的博客

07-20

153

2019独角兽企业重金招聘Python工程师标准>>> ...

vue router-link 上添加点击事件

sanstu的博客

07-24

3223

在vue学习中遇到给router-link添加点击事件无效的情况。例如：发现事件没有执行，后根据vue的官方文档得知想在某个组件的根元素上监听一个原生事件。可以使用.native修饰v-on 例如：这样就可以啦！学习笔记，如有不足请多指教！

解决：页面回退监听事件监听到＜a＞标签的 ‘onClick’ 事件

05-31

1323

工作过程中遇到的bug记录。问题似乎像题目中所示的页面回退监听事件怎么会监听到<a>标签的 onClick 呢？先上代码： H5 <a href="#" @Click="showDetails()">查看详情</a> <div v-show="ifShow === true">详细内容</div> vue-cli 的 JS data () { return { ifshow: false // 显示div的联动变量 } } mounte

vue-事件修饰符

爪哇人的博客

09-28

432

大家可以发现，在点击了showInfo事件并且确定之后，页面自动跳转到超链接了。那么如何阻止这个默认行为呢？可以将时间改成如下形式。5) self：只有event.target是当前操作的元素才触发事件。6）passive：事件的默认行为立即执行，无需等待事件回调执行完毕。以上就演示了默认行为和阻止事件默认行为。1）prevent：阻止默认事件（常用）4）capture：使用事件的捕获模式。3）once：事件只触发一次（常用）2）stop：阻止事件冒泡。

a标签的onclick与href同时存在的处理

烟台-山子的博客

02-04

6322

在用时，我们菜鸟经常会不知道如何处理页面跳转与否的问题，现在我在网上搜索发现了如下内容： 1、链接的onclick事件被先执行，其次是href属性下的动作（页面跳转，或 javascript 伪链接）； 2、如果想让href属性下的动作不执行，onclick必须得到一个false的返值； 3、如果页面过长有滚动条，且希望通过链接的 on

HTML+JS基础之a标签href与onclick事件的冲突处理

SoulArbiter的博客

04-22

4607

这几天尝试一个小项目时遇到的一个很不明显的坑感觉前端初学者都很容易掉进这个坑呀就是在使用a标签中如果同时有 href 和onclick事件时如果没对 href 做处理那么对 onclick 事件本身解析会有干扰举个我今天遇到栗子：在上面贴出的 code 中，因为我把这个链接设置成一个按钮其目的是引发click_scroll函数 (页面滚动到指定位置) ，