阻止a链接跳转的点击事件
<a href="http://www.baidu.com" id="btn">按钮</a>
<script>
document.getElementById('btn').onclick = function () {
console.log('执行要发生的事件逻辑');
}
</script>
上述代码中,点击按钮,就会跳转到新的页面。想要阻止页面的跳转:
在事件函数最后添加一句 return false
<a href="http://www.baidu.com" id="btn">按钮</a>
<script>
document.getElementById('btn').onclick = function () {
console.log('执行要发生的事件逻辑');
return false;
}
</script>
也可以在行内绑定这样做:
<a href="http://www.baidu.com" id="btn" onclick="fn();return false;">按钮</a>
<script>
function fn() {
console.log('执行要发生的事件逻辑');
}
</script>
阻止a链接跳转的点击事件的更多相关文章
- 阻止a标签跳页,使用单击事件函数处理该请求
阻止a标签跳页href="javascript:void(0)" 单击该标签时 页面不跳页 使用单击事件函数来处理该单击请求 返回上一层页面 ---------------- ...
- 阻止a链接跳转方法总结
总结下a标签阻止默认行为的几种简单方法(1) <a href="javascript:void(0);" > 点我 </a> onclick方法负责执行js ...
- Chrome开发者工具应对页面跳转页面点击事件等实用干货
1.如何解决页面跳转 打开Preserve log即可 禁用页面缓存在右边的disable cache 2.如何监听页面点击 重要的是举一反三,看不懂英文去翻译!Mouse鼠标,click点击,,,, ...
- 微信小程序页面跳转绑定点击事件
https://www.cnblogs.com/mrszhou/p/7931747.html
- window.open('') 火狐,IE事件冒泡处理,点击事件冒泡处理
window.open('') 火狐,IE事件冒泡处理,点击事件冒泡处理 写PC下拉菜单的时候,hover样式显示下拉菜单,可能会这样写 <li class="xb_li1" ...
- 阻止点击<a>标签链接跳转
我们常用的在a标签中有点击事件(<a href="地址">链接</a>),其中“href”参数只要不为空,点击该链接时,页面会自动跳转:如果指定的“hr ...
- 阻止iOS Web APP中点击链接跳转到Safari 浏览器新标签页
问题:ios封装完之后,点击里边的按钮会跳转到网页上 ——小卡遇到这个问题就是这样解决的↓↓↓ 解决方法:建议将代码放到</head>标签前,当然,另外存为一个js 文件引用也是可以的呦~ ...
- JS阻止链接跳转代码
刷新后focus在第一个标签 onload="$('#input_email').focus(); " $(document).ready(function(){ $(" ...
- 点击链接跳转到QQ的情况; qq交谈
https://blog.csdn.net/qq_31856835/article/details/70225968 https://blog.csdn.net/qq_37815596/article ...
随机推荐
- LAMP: 分布式 HTTP 2.4.25 + PHP 5.4.13 + MySQL 5.5.28 分离部署
目录 A. 环境说明:B. 效果截图:C. HTTP编译安装D. MySQL二进制安装E. PHP源码编译安装F. PHP连接HTTPG. PHP支持扩展功能xcacheH. PHP连接MySQLI. ...
- num08---原型模式
关键点,实现 Cloneable 接口, 重写clone() 方法.克隆出的对象属性保持一致. 案例: 原型模式在spring 源码中的应用: =========================== ...
- python如何删除二维或者三维数组/列表中某维的空元素
如题,个人在使用python进行数据预处理过程中出现的问题,抽象成删除三维列表中某维为空的问题. 一.首先来看一下三维数组/列表的结构 仔细看下图就会很清楚了: 轴0即是去除第一个外括号后第一层(我把 ...
- css 纯css轮播图 示例
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- 20200223--python学习第15天
今日内容 模块知识 内置模块 time/datatime/json/其他 内容回顾&作业题 重点知识点 构造字典和函数对应的关系,避免重复的if else a = 1 b = 2 ----- ...
- pytorch --- word2vec 实现 --《Efficient Estimation of Word Representations in Vector Space》
论文来自Mikolov等人的<Efficient Estimation of Word Representations in Vector Space> 论文地址: 66666 论文介绍了 ...
- 1215 - Finding LCM
1215 - Finding LCM LCM is an abbreviation used for Least Common Multiple in Mathematics. We say LC ...
- vscode安装使用
1.新建文件:cmd+n2.设置默认浏览器: https://blog.csdn.net/zSY_snake/article/details/83449571 3.view in browser不支持 ...
- redis教程-redis环境搭建安装(qq:1324981084)
需要整套redis缓存高可用集群教学视频的加qq:1324981084,本套视频从安装到集群的搭建和源码的解析,从零基础讲解. 1.利用命令将redis下载到/usr/local/文件夹下: wget ...
- 普通版js运动框架
//获取样式 function getStyle(obj){ if(obj.currentStyle){ return obj.currentStyle[attr]; }else{ return ge ...