click() bind() live() delegate()区别
click(),bind(),live()都是执行事件时使用的方法
1.click()单击事件方法:
$("a").click(function() {
alert("hello");
});
2.在bind()中,jQuery所有JavaScript事件对象,比如focus, mouseover, 和 resize,都是可以作为type参数传递进来的。
var message = "left";
$("a").bind("click", function() {
alert(message);
return false;
});
var message = "left";
$("a").bind("click", { msg: message }, function(e) {
alert(e.data.msg);
return false;
}); var message = "right";
$("a").bind("contextmenu", { msg: message }, function(e) {
alert(e.data.msg);
return false;
});
bind( )方法用于将一个处理程序附加到每个匹配元素的事件上并返回jQuery对象。
.bind(eventType[, evnetData], Handler(eventObject))
其中,参数eventType是一个字符串,包含一个或多个javaScript事件类型,例如click,submit或自定义事件的名称,指定多个事
件类型时用空格分隔各个类型;eventData为Map类型,给出要传递给事件处理程序的数据,handler指定触发该事件时要执行的函
数,eventObject表示事件对象。
.bind()方法将事件处理程序handler附加到匹配元素集合中的每个元素的eventType事件上,如果需要,还可以向事件处理程序传递数据。
3.live()给所有匹配的元素附加一个事件处理函数,即使这个元素是以后再添加进来的也有效。
如果元素是在调用bind()之后添加的,则不能够执行相应的事件。而使用live()方法使得在后边添加的元素也能够执行相应的事件,如下:
$("div.live").live("click", function() {
alert("success");
});
这样,当我们单击class为live的a标签时,如果此a标签是后边添加的,也能照常输出"success"。
live()方法的一个不足在于它不支持链式写法:
$("#test").children("a").live("mouseover", function() {
alert("hello");
});
上边这种写法并不会输出
使用delegate()可以写为:
$("#test").delegate("a", "mouseover", function() {
alert("hello");
});
$('body').delegate('a:not([target="_blank"])', 'click', function (e) {
if ($(this).attr('href') == location.hash) {
$(window).trigger('hashchange');
}
});
停止事件传播
$('a').bind('click',function(e){
e.preventDefault()
e.stopPropagation()}
)
if (e.stopPropagation) {
e.stopPropagation();
}
e.cancelBubble = true;
e是事件触发后传进来的一堆参数,表示事件对象
click() bind() live() delegate()区别的更多相关文章
- jQuery方法区别:click() bind() live() delegate()区别
今天看到一篇jquery 事件的文章,自己写了个小例子,虽然2种方式都可以实现,但是不太明白,找了点资料 $("#box1").delegate("p",&qu ...
- jQuery方法区别(四)click() bind() live() delegate()区别
click(),bind(),live()都是执行事件时使用的方法,他们之前是有一些区别的,我们在使用这些方法时应该根据需要进行选择. 1.click()方法是我们经常使用的单击事件方法: $ ...
- jQuery中的bind() live() delegate()之间区别分析
jQuery中的bind() live() delegate()之间区别分析 首先,你得要了解我们的事件冒泡(事件传播)的概念,我先看一张图 1.bind方式 $('a').bind('click', ...
- jQuery 中bind(),live(),delegate(),on() 区别(转)
当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: D ...
- 转 jQuery 中bind(),live(),delegate(),on() 区别
当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: D ...
- jquery实现input输入框实时输入触发事件代码 ---jQuery 中bind(),live(),delegate(),on() 区别
复制代码 代码如下: <input id="productName" name="productName" value="" /> ...
- jquery bind、delegate、live、on的区别及联系
jquery bind.delegate.live.on的区别及联系 概述 jquery提供了好几个API都可以实现事件绑定, 如 delegate, live , bind 等, 可是有没有疑惑这几 ...
- bind() live()和delegate 区别
Event bubbling (aka event propagation)冒泡 我们的页面可以理解为一棵DOM树,当我们在叶子结点上做什么事情的时候(如click一个a元素),如果我们不人为的设置s ...
- jQuery的.click,.bind,.unbind,.on,.off,.delegate,.undelegate
.click与.bind .click和.bind都是给每个元素绑定事件,对于只绑定一个click事件,.bind事件的简写就是.click那种方式. 这两种方式都会出现两个问题: 第一个问题,如果要 ...
随机推荐
- [转]Hash碰撞冲突解决方法总结
我们知道,对象Hash的前提是实现equals()和hashCode()两个方法,那么HashCode()的作用就是保证对象返回唯一hash值,但当两个对象计算值一样时,这就发生了碰撞冲突.如下将介绍 ...
- [Django学习]Ajax访问静态页面
Web开发中常用的一种开发方式是:通过Ajax进行系统的交互,采用Ajax进行交互的时候,更多的时候传输的是JSON格式的数据. 所以开发中我们需要将数据格式转化成JSON,请参见:https://w ...
- iOS边练边学--transform的简单介绍并且用transform实现键盘处理
一.transform:形变属性,能完成功能:平移,缩放,旋转 <平移> // 根据给的移动距离平移 self.tempView.transform = CGAffineTransform ...
- etl数据库查询
//----------------------------------------利用数据库查询按钮查询-------------------------------------------- st ...
- W/MessageQueue: Handler (android.os.Handler) {4241f8f8} sending message to a Handler on a dead thread
缩略信息是: sending message to a Handler on a dead thread 我是用IntentService时报的 稍微纤细一点儿的信息是: Handler (andro ...
- [mysql] mysql-myibatis-整理
==================================== insert ========================================== 语句1 <inser ...
- 数据库 Oracle监听实例详解
Oracle实例别名 IMCDB = (DESCRIPTION = (ADDRESS = (PROTOCOL = TCP)(HOST = localhost)(PORT = )) (CONNECT_D ...
- Flume1.5.0入门:安装、部署、及flume的案例
转自:http://www.aboutyun.com/thread-8917-1-1.html 问题导读1.什么是flume2.flume的官方网站在哪里?3.flume有哪些术语?4.如何配置flu ...
- D方法 自动完成
控制器 public function insert(){ $Wztj = D("Wztj");if($vo=$Wztj->create()){ if($Wztj->a ...
- 最简单的基于FFMPEG+SDL的音频播放器 ver2 (採用SDL2.0)
===================================================== 最简单的基于FFmpeg的音频播放器系列文章列表: <最简单的基于FFMPEG+SDL ...