很多时候我们都想阻止一个a ?link的href跳转。

1
<a onclick=” return false ;” href=”www. 360 .cn”>click</a>

以上代码可以达到这个效果

有一点要注意

1
2
3
4
5
6
7
function stop(){
  
return false ;
  
}
  
<a onclick=”stop();” href=”www. 360 .cn”>click</a>

这么写是不会阻止默认事件的,stop()反回false, ?onclick却没有返回值 只有事件的返回值是false时 才会阻止默认事件 所以要这么写:

1
<a onclick=” return stop();” href=”www. 360 .cn”>click</a>

这样就会有效果, 那么如果是用绑定事件的方式呢 会怎么样呢

qwrap是用标准的事件绑定方式来做的 可以用它来测试

1
2
3
<a id=”testa” href=”www. 360 .cn”>click</a>
  
W(‘#testa’).click( function (){ return false ;}); // 这是一个标准的绑定事件方法

测试后发现 ie是可以阻止默认事件的 ?标准浏览器 chrome firefox等却没有能阻止 直接发生了跳转

分析后发现因为标准浏览器使用 addEventListener 绑定事件 而该方法是没有返回值的,可参见w3c文档 没有返回值, 返回值当然不会是false所以继续执行href 。

而ie使用attachEvent的方法这个方法是有returnValue的参见?http://msdn.microsoft.com/en-us/library/ie/aa703898(v=vs.85).aspx

所以成功阻止了默认事件,

那么使用addEventListener绑定事件 如何阻止呢 ?

虽然addEventListener 不能有返回值 但是它有一个方法 preventDefault() 专门用来阻止默认事件 ,

1
W(‘#testa’).click( function (e){ e.preventDefault();});

这样就可以成功阻止了.

所以 用addEventListener绑定的事件 必须用preventDefault()来阻止默认事件

但是又有一个现象

1
$(‘#testa’).click( function (){ return false ;});

query 却可以做到, 以上代码运行成功在所有浏览器

这是为什么 ?这并不是jquery可以例外 只是它悄悄的调用了preventDefault() 和 stopPropagation()

jqeury会把事件的响应函数封装在一个dispach的函数里 如果发现你的函数return false 就会同时调会preventDefault() 和stopPropagation()

所以在jquery中 return false 等价于:

1
2
3
4
5
e.preventDefault()
  
e.stopPropagation()
  
return false ;

这三个

由href return false 来看阻止默认事件的更多相关文章

  1. JQUERY中的事件处理:RETURN FALSE、阻止默认行为、阻止冒泡以及兼容性问题

    return false 在jQuery中,我们常用return false来阻止浏览器的默认行为,那"return false"到底做了什么? 当你每次调用"retur ...

  2. JavaScript事件:事件处理模型(冒泡、捕获)、取消冒泡、阻止默认事件

    (一)事件处理模型---事件冒泡.捕获 (1)事件冒泡 24 <body> 25 <div class="warpper"> 26 <div clas ...

  3. 阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return false的区别

    1.event.stopPropagation()方法 这是阻止事件的冒泡方法,不让事件向documen上蔓延,但是默认事件任然会执行,当你掉用这个方法的时候,如果点击一个连接,这个连接仍然会被打开, ...

  4. JS 之 阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return false的区别

    在前端开发中,有时我们需要阻止冒泡和阻止默认事件的发生. 一.event.stopPropagation() 阻止事件的冒泡,不让事件向documen上蔓延,但是默认事件任然会执行,当调用这个方法的时 ...

  5. 阻止事件冒泡,阻止默认事件,event.stopPropagation()和event.preventDefault(),return fal的区别

    今天来看看前端的冒泡和事件默认事件如何处理 1.event.stopPropagation()方法 这是阻止事件的冒泡方法,不让事件向documen上蔓延,但是默认事件任然会执行,当你掉用这个方法的时 ...

  6. js为链接绑定点击事件并且附带return false;来阻止跳转

    <!DOCTYPE HTML> <html> <head> <meta charset="gb2312" /> <title& ...

  7. js阻止默认事件,如a标签跳转和事件冒泡

    禁止a标签点击跳转 <a href="http://baidu.com" onclick="return false">点我啊</a> ...

  8. (O)阻止默认事件和阻止冒泡的应用场景

    场景1:阻止默认事件   比如这样的一个需求 点击取消a标签按钮的时候会触发一些js动作,但是不能让这个a标签产生跳转行为, 所以需要在点击取消的时候 阻止冒泡,防止其跳转. <a id='ca ...

  9. jquery 阻止冒泡事件和阻止默认事件

    jQuery 冒泡和默认事件: <!DOCTYPE html> <html lang="en"> <head> <meta charset ...

随机推荐

  1. dhtmlx之dhtmlXGrid显示数据 --大数据

    引用 <link href="../../dhtmlXGridScripts/dhtmlxgrid.css" rel="stylesheet" type= ...

  2. 从数据库中,绑定JQuery Accordion控件---Repeater control

    http://aspsnippets.com/Articles/jQuery-Accordion-example-in-ASPNet-using-C-and-VBNet.aspx 1. 添加JQuer ...

  3. 循环次数( M - 暴力求解、打表)

    循环次数 Description           我们知道,在编程中,我们时常需要考虑到时间复杂度,特别是对于循环的部分.例如,         如果代码中出现         for(i=1;i ...

  4. VS 2013上Python的配置

    最近有点不务正业,去看了下Python (主要是学校OJ有这个语言,然后可以轻松解决大数据问题,不要说我太坑~~~) 目前感觉python和matlab有些类似,缺少了变量类型声明,总感觉自己写出来的 ...

  5. Android 中 ListView Adapter getView 被多次调用问题 解决方法

    执行多次原因是因为每显示一个VIew,它都去测量view的高度,执行measure方法,导致getView执行多次. 解决方法是将 ListView 的 layout_width 设置为 fill_p ...

  6. CPU保护模式深入探秘

    原文链接为:http://www.chinaunix.net/old_jh/23/483510.html 保护方式的体系结构 主要问题:          保护方式的寄存器模型          保护 ...

  7. Jekyll学习:基本使用方法

    Jekyll是一个简单的博客.静态网站生成工具.利用它可以快速的搭建一个网站.并且完全免费的在 GitHub 上发布网站 — 自定义域名. 一.环境搭建 apt-get install jekyll ...

  8. 用python解析html

    python中,有三个库可以解析html文本,HTMLParser,sgmllib,htmllib.他们的实现方法不通,但功能差不多.这三个库中 提供解析html的类都是基类,本身并不做具体的工作.他 ...

  9. 【模式识别】SVM核函数

    下面是几种经常使用的核函数表示: 线性核(Linear Kernel) 多项式核(Polynomial Kernel) 径向基核函数(Radial Basis Function) 也叫高斯核(Gaus ...

  10. Adobe Acrobat Ⅺ Pro安装激活

    1.注意一定要断网安装,如果你有防火墙拦截亦可(注意:系统自带那防火墙不行). 2.将AcrobatPro_11_Web_WWMUI.exe解压到一个目录下,找到目录下的setup.exe安装,安装时 ...