阻止a链接跳转方法总结
总结下a标签阻止默认行为的几种简单方法
(1)
<a href="javascript:void(0);" > 点我 </a>
onclick方法负责执行js函数,而void是一个操作符,void(0)返回undefined,地址不发生跳转。
<a href="javascript:;" > 点我 </a>
和void(0)一样,都返回"undefined"
(2)
<a href="#"> 点我 </a>
是网上很常见的代码,#是标签内置的一个方法,用这种方法点击后网页后返回到页面的最顶端所以又有了“##”“#!”等,尽管解决了返回顶部的问题但仍存在其他缺陷
(3)事件处理函数的工作机制中,在给某元素添加事件处理函数后,一旦事件发生,相应JavaScript代码就会执行,所调用的JavaScript代码的返回值被传递给事件处理函数。当我们给a标签添加onclick事件处理函数并点击a触发其后,
如果相应JavaScript代码返回true,onclick事件处理函数就会认为这个链接呗点击了,同样的若返回false即会认为链接
未被点击
<a href="http://www.baidu.com" onclick=" myjs(); return false; "> 点我 </a>
<a href="http://www.baidu.com" onclick=" return false; "> 点我 </a>
当点击a标签时,JavaScript代码返回值为false,故此链接默认行为未被触发。
(4)preventDefault()阻止事件的默认行为但不支持IE,所以在IE中使用returnValue阻止事件默认行为
<a href="http://www.baidu.com" id="test"> 点我 </a>
<script type="text/javascript">
var test = document.getElementById('test');
function stopDefault( e )
{
if ( e && e.preventDefault )
e.preventDefault();
else
window.event.returnValue = false;
}
test.onclick = function(e)
{
stopDefault(e);
}
</script>
阻止a链接跳转方法总结的更多相关文章
- 阻止a链接跳转的点击事件
<a href="http://www.baidu.com" id="btn">按钮</a> <script> docume ...
- JS阻止链接跳转代码
刷新后focus在第一个标签 onload="$('#input_email').focus(); " $(document).ready(function(){ $(" ...
- 阻止iOS Web APP中点击链接跳转到Safari 浏览器新标签页
问题:ios封装完之后,点击里边的按钮会跳转到网页上 ——小卡遇到这个问题就是这样解决的↓↓↓ 解决方法:建议将代码放到</head>标签前,当然,另外存为一个js 文件引用也是可以的呦~ ...
- 关于锚点页内链接跳转出现问题(不响应,没有反应)的解决方法(ZT)
我们知道,利用锚点可以实现页面链接跳转,也可以实现同一页面内的跳转功能. 例如:<a href="somepage.htm>某页面链接</a> 可以跳转链接到som ...
- android/IOS各平台分享链接/跳转链接配置说明(备用)
Android: [Java] 纯文本查看 复制代码 ? 01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 微信/朋友圈 //设置 ...
- iframe中的各种跳转方法
iframe中的各种跳转方法(转) 一.背景A,B,C,D都是jsp,D是C的iframe,C是B的iframe,B是A的iframe,在D中跳转页面的写法区别如下. 二.JS跳转window.l ...
- php开发中的页面跳转方法总结
PHP页面跳转实现的功能就是将网站中一个网页跳转到另一个网页中.对于刚刚学习PHP语言的朋友来说,是必须要掌握的基础方法. 页面跳转可能是由于用户单击链接.按钮等触发的,也可能是系统自动产生的.页面自 ...
- 阻止a标签跳转四种方法 兼容各大浏览器(包括IE)
阻止a标签跳转四种方法 兼容各大浏览器(包括IE) HTML <!--第一种--> <a href="javascript:;">我不会被跳转</a& ...
- C#中页面之间跳转方法比较
一直以来,各种跳转方法混用,浑浑噩噩没有仔细去了解过每个跳转方法的区别 1.<a herf="default.asp"></a> 超链接跳转 2.< ...
随机推荐
- [P1020]导弹拦截 (贪心/DP/二分/单调队列)
一道很经典的题 这道题就是要求一个最长单调不升子序列和一个最长单调上升子序列. 先打了一个n2复杂度的 用DP #include<bits/stdc++.h> using namespac ...
- WebStorm中使用npm包管理器
1.首先安装Node.js,安装之后添加NodeJs的安装路径到系统Path环境变量,在控制台之中测试node,与npm命令是否工作正常. 2.配置npm的源为国内的淘宝镜像,这里不推荐使用cnpm ...
- json文件读写函数
老师代码: import json def op_data(filename,dic=None): if dic:#写入进去 with open(filename,'w',encoding='utf- ...
- nested exception is java.lang.ClassNotFoundException
当出现nested exception is java.lang.ClassNotFoundException这个异常的时候,首先排查类是否存在.如果存在,是maven项目的话,clean.insta ...
- 【容斥+组合数】Massage @2018acm徐州邀请赛 E
问题 E: Massage 时间限制: 1 Sec 内存限制: 64 MB 题目描述 JSZKC feels so bored in the classroom that he w ...
- pygame 笔记-7 生命值/血条处理
通常游戏中的角色都有所谓的生命值,而且头顶上会有一个血条显示.生命值无非就是一个属性而已,很容易在Player.py类中增加,头顶上的血条其实就是绘制二个矩形,叠加在一起. 以上节的Player.py ...
- Asp.NET WebApi+Redis实现单用户登录实战演练
一.课程介绍 本次分享课程属于<C#高级编程实战技能开发宝典课程系列>中的一部分,阿笨后续会计划将实际项目中的一些比较实用的关于C#高级编程的技巧分享出来给大家进行学习,不断的收集.整理和 ...
- Linux系统下分析内存使用情况的管理工具
有许多办法可以获得Linux系统上所安装内存的信息,并查看其中有多少内存正在使用中.有的命令会展示大量的细节,而有的命令则提供了简洁(但不一定容易理解)的结果.在这篇文章中将介绍一些更有用的工具,帮助 ...
- [Vuex] Split Vuex Store into Modules using TypeScript
When the Vuex store grows, it can have many mutations, actions and getters, belonging to different c ...
- iqiyi__youku__cookie_设置
iqiyi设置cookie var string = "此处替换iqiyi的cookie"; var getCookie = function( str) { var cookie ...