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那种方式. 这两种方式都会出现两个问题: 第一个问题,如果要 ...
随机推荐
- git过期处理
删除git下的文件:C:\Users\Java\AppData\Roaming\syntevo\......\7\settings.xml删除settings.xml文件即可
- Oracle分页(limit方式的运用)
select * from a_matrix_navigation_map where rowid not in(select rowid from a_matrix_navigation_map w ...
- iOS边练边学--plist文件,懒加载,模型初使用--补充instancetype
一.什么是plist文件 1>将数据直接写在代码里面,不是一种合理的做法.如果数据经常修改,就要经常翻开对应的代码进行修改,造成代码扩展性低 2>因此,可以考虑将经常变得数据放在文件中进行 ...
- html精灵技术(用来显示图片的某个区域)
.left .left_down li.a.left-down-pic{display:block;width:50px;height:50px;background:url(images/app_i ...
- 《FPGA全程进阶---实战演练》第三章之PCB设计之过孔
在画电路板时,往往需要过孔来切换层之间的信号.在PCB设计时,过孔的选择有盲孔,埋孔,通孔.如图3.1所示.盲孔是在表面或者底面打通到内层面,但不打穿,埋孔是在内层面之间的孔,不在表面和底面漏出:通孔 ...
- 关于Cocos2d-x的瓦片地图
1.cocos2d-x的瓦片地图是用Tiled地图编辑器做的,这个软件开源,免费,一般都是用它制作瓦片地图. 2.瓦片地图是由块层和对象组成的,块层的作用是显示和一些重叠的时候覆盖角色的作用,而对象是 ...
- 第三百一十六节,Django框架,中间件
第三百一十六节,Django框架,中间件 django 中的中间件(middleware),在django中,中间件其实就是一个类,在请求到来和结束后,django会根据自己的规则在合适的时机执行中间 ...
- e683. 设置打印的方向
PrinterJob pjob = PrinterJob.getPrinterJob(); PageFormat pf = pjob.defaultPage(); if (portrait) { pf ...
- 查找——图文翔解HashTree(哈希树)
引 在各种数据结构(线性表.树等)中,记录在结构中的相对位置是随机的.因此在机构中查找记录的时须要进行一系列和keyword的比較.这一类的查找方法建立在"比較"的基础上.查找的效 ...
- Python的可变对象与不可变对象。
参考:http://thomaschen2011.iteye.com/blog/1441254 Python基础:Python可变对象和不可变对象 http://blog.jobbo ...