1、通过返回false来取消默认的行为并阻止事件起泡。

jQuery 代码:

1
2
3
4
5
6
7
8
9
10
11
$("form").bind(
 
  "submit",
 
  function() {
 
    return false;
 
   }
 
);

2、通过使用 preventDefault() 方法只取消默认的行为。

jQuery 代码:

1
2
3
4
5
6
7
8
9
$("form").bind(
 
  "submit",
 
  function(event){
    event.preventDefault();
  }
 
);

3、通过使用 stopPropagation() 方法只阻止一个事件起泡。

jQuery 代码:

1
2
3
4
5
6
7
8
9
$("form").bind(
 
  "submit",
 
  function(event){
    event.stopPropagation();
  }
 
);

(4)总结

1. 一个事件起泡对应触发的是上层的同一事件

特殊:如果two设置成双击事件,那么在你单击two的时候就会起泡触发one单击的事件

(双击包含单击)。

2. 如果在click事件中,在你要处理的事件之前加上e.preventDefault();

那么就取消了行为(通俗理解:相当于做了个return操作),不执行之后的语句了。

3. e.stopPropagation()只要在click事件中,就不会触发上层click事件。

1
2
3
4
5
6
7
8
9
10
11
//如果提供了事件对象,则这是一个非IE浏览器
 
if ( e && e.stopPropagation )
  // 因此它支持W3C的stopPropagation()方法
  
e.stopPropagation();
else
  //否则,我们需要使用IE的方式来取消事件冒泡
  
window.event.cancelBubble = true;
return false;

jquery取消事件冒泡的三种方法(推荐)的更多相关文章

  1. jquery取消事件冒泡的三种方法展示

    jquery取消事件冒泡的三种方法展示 html代码 <!doctype html> <html> <head> <meta charset="ut ...

  2. Html 中阻止事件冒泡的三种方法比较

    A:return false --->In event handler ,prevents default behavior and event bubbing .         return ...

  3. C#中??和?分别是什么意思? 在ASP.NET开发中一些单词的标准缩写 C#SESSION丢失问题的解决办法 在C#中INTERFACE与ABSTRACT CLASS的区别 SQL命令语句小技巧 JQUERY判断CHECKBOX是否选中三种方法 JS中!=、==、!==、===的用法和区别 在对象比较中,对象相等和对象一致分别指的是什么?

    C#中??和?分别是什么意思? 在C#中??和?分别是什么意思? 1. 可空类型修饰符(?):引用类型可以使用空引用表示一个不存在的值,而值类型通常不能表示为空.例如:string str=null; ...

  4. jQuery中detach&&remove&&empty三种方法的区别

    jQuery中empty&&remove&&detach三种方法的区别 empty():移除指定元素内部的所有内容,但不包括它本身 remove():移除指定元素内部的 ...

  5. Android监听点击事件实现的三种方法

    监听点击事件实现的三种方法:1.匿名内部类2.外部类3.直接实现接口 1.匿名内部类: package com.jereh.calculator; import android.content.Con ...

  6. jquery动态加载js三种方法实例

    这里为你提供了三种动态加载js的jquery实例代码哦,由于jquery是为用户提供方便的,所以利用jquery动态加载文件只要一句话$.getScript(\"test.js\" ...

  7. jQuery 取消事件冒泡 阻止后续内容执行 闭包函数 (学习笔记)

    1.取消事件冒泡 <title>取消事件冒泡</title> <style> div { border:solid 1px black; } </style& ...

  8. jquery阻止元素冒泡的两种方法

    通常情况下,如果给父元素添加事件之后,子元素也会继承同样的事件,这个时候就要阻止子元素的这种行为,成为阻止冒泡,总结两种解决方法: html代码: <div id="parent&qu ...

  9. jquery取消事件冒泡和取消默认行为

    $('button').click(functon(e){ /*code*/ e.stopPropagation();//取消事件冒泡 e.preventDefault();//取消默认行为 })

随机推荐

  1. 【转】图文详解YUV420数据格式

    YUV格式有两大类:planar和packed. 对于planar的YUV格式,先连续存储所有像素点的Y,紧接着存储所有像素点的U,随后是所有像素点的V.对于packed的YUV格式,每个像素点的Y, ...

  2. No resource identifier found for attribute 'showAsAction' in package 'android'

    运行一个项目时在一个menu.xml文件item属性android:showAsAction 报错 No resource identifier found for attribute 'showAs ...

  3. JS实现base64加密解密

    JS实现base64加密解密 转载自http://blog.csdn.net/fengzheng0306/archive/2006/04/25/676055.aspx 方法一: <HTML> ...

  4. 重读 code complete 说说代码质量

    重读code complete 说说代码质量 2014年的第一篇文章本来计划写些过去一年的总结和新年展望,但是因为还有一些事情要过一阵才能完成,所以姑且不谈这个,说说最近重读code complete ...

  5. SharedPreferences 详解(多进程,存取数组解决方案)

    一.SharedPreferences基本概念 文件保存路径:/data/data/<包名>/shared_prefs目录下目录下生成了一个SP.xml文件 SharedPreferenc ...

  6. 寻找Fragment的替代品的尝试

    自从Android在3.0推出Fragment之后,现在很多应用的设计都是建立在Fragment的基础上,像是多个tab切换这种需求,就可以使用Fragment,并且Fragment提供了一系列生命周 ...

  7. 解决matplotlib的中文问题

    matplotlib的强大无需我去言说,但它对使用中文的我来说却有一点瑕疵,那就是--在默认状态下,matplotlb无法在图表中使用中文. 在网上查找了一些资料,发现matplotlib本身是支持U ...

  8. Load Audio or Vedio files

    //Load Audio or Vedio files private void btnLoadFile_Click(object sender, EventArgs e) { Startindex ...

  9. Net.Sockets

    #region 程序集 System, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089 // C:\Program ...

  10. 安装windows系统的installutil

    /// 该服务必须在它可以执行之前安装.    /// 服务的安装和卸载“installutil.exe”“installutil.exe / U”的服务可执行文件作为最后一个参数.    ///  ...