【转】jquery-取消冒泡
转自:http://blog.163.com/css_mm/blog/static/209182176201262665157634/
1、通过返回false来取消默认的行为并阻止事件起泡。
jQuery 代码:
$("form").bind(
"submit",
function() {
return false;
}
);
2、通过使用 preventDefault() 方法只取消默认的行为。
jQuery 代码:
$("form").bind(
"submit",
function(event){
event.preventDefault();
}
);
3、通过使用 stopPropagation() 方法只阻止一个事件起泡。
jQuery 代码:
$("form").bind(
"submit",
function(event){
event.stopPropagation();
}
);
(4)总结
1.一个事件起泡对应触发的是上层的同一事件
特殊:如果two设置成双击事件,那么在你单击two的时候就会起泡触发one单击的事件
(双击包含单击)。
2.如果在click事件中,在你要处理的事件之前加上e.preventDefault();
那么就取消了行为(通俗理解:相当于做了个return操作),不执行之后的语句了。
3.e.stopPropagation()只要在click事件中,就不会触发上层click事件。
//如果提供了事件对象,则这是一个非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 ...
- jquery 事件冒泡的介绍以及如何阻止事件冒泡
在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理程序或者事件返回true,那么这个事件会向这个对象的父级 ...
- JS:event对象下的target属性和取消冒泡事件
1.target 通过获取DOM元素 var box = document.getElementById("box"); document.box.onclick = functi ...
- jQuery event,冒泡,默认事件用法
jQuery event,冒泡,默认事件用法 <%@ page language="java" import="java.util.*" pageEnco ...
- 移动端和pc端事件绑定方式以及取消浏览器默认样式和取消冒泡
### 两种绑定方式 (DOM0)1.obj.onclick = fn; (DOM2)2. ie:obj.attachEvent(事件名称,事件函数); 1.没有捕获(非标准的ie 标准的ie底下有 ...
- javascript 事件冒泡与取消冒泡
事件冒泡: 当一个元素上的事件被触发时,比如说鼠标点击了一个按钮,同样的事件将会在那个元素的所有祖先中被触发,这一过程被称为事件冒泡. 这个事件从原始祖先开始,一直冒泡到DOM树的最上层.(bug) ...
- 阻止jQuery事件冒泡
Query对DOM的事件触发具有冒泡特性.有时利用这一特性可以减少重复代码,但有时候我们又不希望事件冒泡.这个时候就要阻止 jQuery.Event冒泡. 在jQuery.Event 的文档 中的开头 ...
- jquery取消绑定的方法
jquery取消绑定的方法 一般用变量控制 不要用unbind() 相应比较慢 <pre> $('.choseitem').on('click', function () { //如果设置 ...
- javascript的自定义对象/取消事件/事件兼容性/取消冒泡
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- JavaScript事件:事件处理模型(冒泡、捕获)、取消冒泡、阻止默认事件
(一)事件处理模型---事件冒泡.捕获 (1)事件冒泡 24 <body> 25 <div class="warpper"> 26 <div clas ...
随机推荐
- CSV文件导入到SQL Server表中
USE 数据库名BULK Insert dbo.表名From 'c:\CSV文件名.csv' WITH ( FIELDTERMINATOR = ',', ROWTERMINATOR = '\ ...
- Oracle 基础 导入数据库 删除用户、删除表空间、删除表空间下所有表
导入数据库 在cmd下用 imp导入 格式: imp userName/passWord file=bmp文件路径 ignore = y (忽略创建错误)full=y(导入文件中全部内容); 例: ...
- 以OpenGL方式运行Unity
Unity在Windows上默认以DirextX的方式运行,在MacOS和Linux上默认以OpenGl的方式运行, 如果希望在Windows上以OpenGL的方式运行可以在命令行中输入 -force ...
- Windows下安装GnuRadio最简单的方法(没有之一)
作者在Windows XP SP3 32位下亲测通过,理论上Win7也没问题. 1. 如果系统中安装有Python,请先把Python卸载. 2. 下载安装Python(x,y) 2.7.5.0, 下 ...
- 【风马一族_C】进制转化
#include "stdio.h" #include "Math.h" #define number 50 //设置数组的长度 int num10; //十进 ...
- centos下安装图像化界面
前面我们安装的centos系统多为没有图像化界面的命令行界面,为了安装oracle等工具,我们先为我们的centos安装图像化界面 使用命令为 yum groupinstall "Deskt ...
- WCF 配置文件(三)
配置文件概述 WCF服务配置是WCF服务编程的主要部分.WCF作为分布式开发的基础框架,在定义服务以及定义消费服务的客户端时,都使用了配置文件的方法.虽然WCF也提供硬编程的方式,通过在代码中直接设置 ...
- 对图片进行各种样式裁对图片进行各种样式裁剪:圆形、星形、心形、花瓣形等剪:圆形、星形、心形、花瓣形等--第三方开源--CustomShapeImageView
CustomShapeImageView在github上的项目主页是:https://github.com/MostafaGazar/CustomShapeImageView 如果仅仅是需要获取圆形. ...
- How to enables AX email functionality without Outlook
/***************************************************************** (C) Copyright DENTSPLY Internatio ...
- Python-Day7 面向对象进阶/异常处理/Socket
一.面向对象高级语法部分 1.静态方法 通过@staticmethod装饰器即可把其装饰的方法变为一个静态方法,什么是静态方法呢?其实不难理解,普通的方法,可以在实例化后直接调用,并且在方法里 ...