阻止A标签默认行为的问题

转载 2018年04月15日 22:51:36

1. 链接的onclick事件被先执行,其次是href属性下的动作(页面跳转,或 javascript 伪链接);

2. 假设链接中同时存在href与onclick,如果想让href属性下的动作不执行,onclick必须得到一个false的返值

3. 如果页面过长有滚动条,且希望通过链接的 onclick事件执行操作。应将它的 href属性设为 javascript:void(0);  ,而不要是 #,这可以防止不必要的页面跳动;

4. 如果在链接的 href属性中调用一个有返回值的函数,当前页面的内容将被此函数的返回值代替;

5. 在按住Shift键的情况下会有所区别。

6. 今天我遇到的问题,在IE6.0里以href的形式访问不到parentNode。

7. 尽量不要用javascript:协议做为A的href属性,这样不仅会导致不必要的触发window.onbeforeunload事件,在IE里面更会使gif动画图片停止播放。

 

关于:void

Java script中void是一个操作符,该操作符指定要计算一个表达式但是不返回值。

void 操作符用法格式如下:

1. javascript:void (expression)

2. javascript:void expression

expression 是一个要计算的 Javascript 标准的表达式。表达式外侧的圆括号是选的,但是写上去是一个好习惯。

你以使用 void 操作符指定超级链接。表达式会被计算但是不会当前文档处装入任何内容。

 

关于 return false

 

通常, event.preventDefault()都会放在event handler的第一行。
这样的话, 假设在event handler中有一个JavaScript error,
那么, 放在first lineevent.preventDefault()就可以阻止submit行为, console还可以report这error.

而, return false是放在event handler的最后一行的。
并且, 他是相当于event.preventDefault()event.stopPropagation(), 如果我们想阻止bubbling的话, 就可以用return false.

更重要的是, return false只能用于DOM Level 0 Event handler,DOM Level 2 Event Handler是没用的, 

复制代码

1// get the anchors 

var anchors = document.querySelectorAll("a");
3 var a1 = anchors[0];
4 var a2 = anchors[1];
5 // DOM Level 0 Event Handler
6 a1.onclick = function(event) {  return false;};
7 // DOM Level 2 Event Handler
8 a2.addEventListener("click", function() {  return false;}, false);

复制代码

而, event.preventDefault()2者都兼容。

 

综上, 当然是推荐用event.preventDefault()啦。

 

几种格式

 

1: <a href="####"></a>

2:<a href="javascript:void(0)"></a>

3:<a href="javascript:"></a>

4:<a href="javascript:void(null)"></a>

5:<a href="#" onclick="return false"></a>


怎么样阻止a标签的默认行为

在我们项目中,有很多a标签当按钮使用的场景,每当点击这些“按钮“进行操作时,总会调到页面顶部,印象中可以使用return false来解决,但加到onclick属性的js函数里并没有效果,必须放在js...
  • MOLIILOM
  • MOLIILOM
  • 2016-05-21 11:30:40
  • 1826

阻止a标签跳转的默认行为

跳转到百度 document.getElementById('aaa').onclick
  • adley_app
  • adley_app
  • 2017-11-03 13:45:33
  • 499

阻止默认行为

一、什么是默认行为 默认行为是指html标签自带的默认行为,比如a标签的默认跳转,button标签的默认提交。二、为什么要阻止默认行为 比如之前做的一个项目换乘案内只有首页的设计是自己的,剩下的数...
  • candy_tity
  • candy_tity
  • 2016-11-17 12:23:15
  • 357

阻止a标签默认行为的几种简单方法

以下简单总结以下a标签阻止默认行为的几种简单方法,希望可以对有需要的朋友有些帮助, (1)    Click Me   onclick方法负责执行js函数,而void是一个操作符,void(0)返回...
  • judas_jia
  • judas_jia
  • 2016-04-16 09:59:00
  • 39884

阻止a标签默认事件的几种简单方法

第一种: 百度 或者百度 测试:(可行)百度 百度1 function myjs(){ alert("a标签默认事件被阻止,执行js函数"); } 第二种:百度...
  • wangcuiling_123
  • wangcuiling_123
  • 2017-06-27 14:57:20
  • 993

JQuery 阻止默认行为

问题及效果: 什么是默认行为? 如:a 标签的点击跳转、submit按钮的点击提交、选中文本的拖拽搜索等等…… 有时我只是需要a标签的样式并不希望有点击跳转的效果; 用户填写完表单时,表单内容也会在前...
  • weixin_38849871
  • weixin_38849871
  • 2017-08-05 23:26:20
  • 105

javascript 处理a标签超链接的默认事件

有时需要在a标签上添加click事件,并且跳转前处理一些事务,故需要做一些处理;通常前端会给出一个link来代表这个行为,有些还会这样写link或者link这样的写法,但这样并不兼容所有浏览器,有些浏...
  • yageeart
  • yageeart
  • 2014-09-11 16:13:55
  • 8583

Angularjs 阻止默认事件

Angularjs 阻止默认事件
  • wild46cat
  • wild46cat
  • 2016-09-05 11:14:54
  • 4724

小花 - React事件阻止浏览器默认行为/冒泡

买生活用品就去www.tianmaovip.cn比超市便宜!!版权声明:http://blog.csdn.net/mx18519142864/article/details/79297394React...
  • mx18519142864
  • mx18519142864
  • 2018-02-09 13:13:32
  • 125

js阻止默认行为

摘要: js默认行为阻止 一.哪些默认行为要做阻止 1.a标签链接跳转 什么是默认行为?一个最简单的例子,我有一个a标签: a href="https://www.baidu.co...
  • u010978477
  • u010978477
  • 2017-09-14 22:51:41
  • 139
收藏助手
不良信息举报
您举报文章:阻止A标签默认行为的问题
举报原因:
原因补充:

(最多只允许输入30个字)