jquery取消事件冒泡的三种方法(推荐)
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取消事件冒泡的三种方法(推荐)的更多相关文章
- jquery取消事件冒泡的三种方法展示
jquery取消事件冒泡的三种方法展示 html代码 <!doctype html> <html> <head> <meta charset="ut ...
- Html 中阻止事件冒泡的三种方法比较
A:return false --->In event handler ,prevents default behavior and event bubbing . return ...
- C#中??和?分别是什么意思? 在ASP.NET开发中一些单词的标准缩写 C#SESSION丢失问题的解决办法 在C#中INTERFACE与ABSTRACT CLASS的区别 SQL命令语句小技巧 JQUERY判断CHECKBOX是否选中三种方法 JS中!=、==、!==、===的用法和区别 在对象比较中,对象相等和对象一致分别指的是什么?
C#中??和?分别是什么意思? 在C#中??和?分别是什么意思? 1. 可空类型修饰符(?):引用类型可以使用空引用表示一个不存在的值,而值类型通常不能表示为空.例如:string str=null; ...
- jQuery中detach&&remove&&empty三种方法的区别
jQuery中empty&&remove&&detach三种方法的区别 empty():移除指定元素内部的所有内容,但不包括它本身 remove():移除指定元素内部的 ...
- Android监听点击事件实现的三种方法
监听点击事件实现的三种方法:1.匿名内部类2.外部类3.直接实现接口 1.匿名内部类: package com.jereh.calculator; import android.content.Con ...
- jquery动态加载js三种方法实例
这里为你提供了三种动态加载js的jquery实例代码哦,由于jquery是为用户提供方便的,所以利用jquery动态加载文件只要一句话$.getScript(\"test.js\" ...
- jQuery 取消事件冒泡 阻止后续内容执行 闭包函数 (学习笔记)
1.取消事件冒泡 <title>取消事件冒泡</title> <style> div { border:solid 1px black; } </style& ...
- jquery阻止元素冒泡的两种方法
通常情况下,如果给父元素添加事件之后,子元素也会继承同样的事件,这个时候就要阻止子元素的这种行为,成为阻止冒泡,总结两种解决方法: html代码: <div id="parent&qu ...
- jquery取消事件冒泡和取消默认行为
$('button').click(functon(e){ /*code*/ e.stopPropagation();//取消事件冒泡 e.preventDefault();//取消默认行为 })
随机推荐
- php手册总结(一)
一:自动加载 __autoload(): 注意: 1:spl_autoload_register() 提供了一种更加灵活的方式来实现类的自动加载.因此,不再建议使用 __autoload() 函数,在 ...
- php易混淆知识点
一.define(“constant”, “hello world”);和const constant = “hello world”;的区别? (0).使用const使得代码简单易读,const本 ...
- Moon River
读书笔记系列链接地址http://www.cnblogs.com/shoufengwei/p/5714661.html. 昨晚无意中听到了一首英文歌曲,虽不知其意,但是瞬间就被优美的旋律 ...
- CSS 魔法系列:纯 CSS 绘制图形(心形、六边形等)
<CSS 魔法系列>继续给大家带来 CSS 在网页中以及图形绘制中的使用.这篇文章给大家带来的是纯 CSS 绘制五角星.六角形.五边形.六边形.心形等等. 我们的网页因为 CSS 而呈现千 ...
- Android监听来电和去电
要监听android打电话和接电话,只需下面2步骤1.第一步,写一个Receiver继承自BroadcastReceiver import android.app.Service; import an ...
- DPDK学习之开篇介绍
1.前言 记得刚开始工作的时,老大将我安排到数据面组,当时第一次听说”数据面“这个概念,感觉挺新鲜的.误打误撞就开始搞了,刚开始接触的时候,由于不懂其中的原理,觉得很神奇,因为报文的转发是在应用层,通 ...
- JS魔法堂:再次认识Function.prototype.call
一.前言 大家先预计一下以下四个函数调用的结果吧! var test = function(){ console.log('hello w ...
- Android Studio添加PNG图片报错原因
今天在网上看到一个关于Splash Activity的Android帖子,博主在一通讲解之后也给出了代码.于是果断下载下来了看看怎么实现的.一步步照着流程把这个功能实现了一遍.一切都没有大问题,但是在 ...
- 数据结构(C语言第2版)----时间复杂度和单链表
马上要到校招了,复习下相关的基础知识. 时间复杂度是什么? 官方解释: 算法的执行时间需要依据算法所编制的程序在计算机上于运行时所消耗的时间来度量.在算法中可以使用基本的语句的执行次数作为算法的时间复 ...
- 优化Angular应用的性能
MVVM框架的性能,其实就取决于几个因素: 监控的个数 数据变更检测与绑定的方式 索引的性能 数据的大小 数据的结构 我们要优化Angular项目的性能,也需要从这几个方面入手. 1. 减少监控值的个 ...