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()区别的更多相关文章

  1. jQuery方法区别:click() bind() live() delegate()区别

    今天看到一篇jquery 事件的文章,自己写了个小例子,虽然2种方式都可以实现,但是不太明白,找了点资料 $("#box1").delegate("p",&qu ...

  2. jQuery方法区别(四)click() bind() live() delegate()区别

        click(),bind(),live()都是执行事件时使用的方法,他们之前是有一些区别的,我们在使用这些方法时应该根据需要进行选择. 1.click()方法是我们经常使用的单击事件方法: $ ...

  3. jQuery中的bind() live() delegate()之间区别分析

    jQuery中的bind() live() delegate()之间区别分析 首先,你得要了解我们的事件冒泡(事件传播)的概念,我先看一张图 1.bind方式 $('a').bind('click', ...

  4. jQuery 中bind(),live(),delegate(),on() 区别(转)

    当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: D ...

  5. 转 jQuery 中bind(),live(),delegate(),on() 区别

    当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: D ...

  6. jquery实现input输入框实时输入触发事件代码 ---jQuery 中bind(),live(),delegate(),on() 区别

    复制代码 代码如下: <input id="productName" name="productName" value="" /> ...

  7. jquery bind、delegate、live、on的区别及联系

    jquery bind.delegate.live.on的区别及联系 概述 jquery提供了好几个API都可以实现事件绑定, 如 delegate, live , bind 等, 可是有没有疑惑这几 ...

  8. bind() live()和delegate 区别

    Event bubbling (aka event propagation)冒泡 我们的页面可以理解为一棵DOM树,当我们在叶子结点上做什么事情的时候(如click一个a元素),如果我们不人为的设置s ...

  9. jQuery的.click,.bind,.unbind,.on,.off,.delegate,.undelegate

    .click与.bind .click和.bind都是给每个元素绑定事件,对于只绑定一个click事件,.bind事件的简写就是.click那种方式. 这两种方式都会出现两个问题: 第一个问题,如果要 ...

随机推荐

  1. /etc/fstab文件损坏怎么办

    第一步首先关机挂载磁盘 第二步开机启动从BIOS,关键字F2 第三步光盘启动进入救援模式 第四步vi /mnt/sysimagimage/etc/fstab ,编辑完exit退出,reboot 进入光 ...

  2. golang 垃圾回收 gc

    http://ruizeng.net/golang-gc-internals/ 摘要 在实际使用go语言的过程中,碰到了一些看似奇怪的内存占用现象,于是决定对go语言的垃圾回收模型进行一些研究.本文对 ...

  3. mysql修改密码与password字段不存在mysqladmin connect to server at localhost failed

    mysqladmin: connect to server at 'localhost' failed 停止mysql服务 systemctl stop mysql 安全模式启动 chown -R m ...

  4. 防止短连接耗尽你的动态TCP端口

    详见TCP协议https://en.wikipedia.org/wiki/Transmission_Control_Protocol但是TIME_WAIT是有时间窗口的,Linux默认是60秒.所以如 ...

  5. Framework 7 日历插件改成Picker 模式

    Framework 7 里面的日历插件默认的2种模式: 1.文本框 2.直接展示 如下图: 更多例子点这里 而我的需求如下图: 点击小图标再弹出日历,选择某个日期,隐藏日历弹层. 实现步骤: 1.写小 ...

  6. 页面装载js及性能分析方法

    一.装载 先装载静态页面的引用js文件,然后查找引用文件中是否包含onload函数,比如main.js中包含onload函数,在main.js中查找是否有对其他js文件的引用,优先装载引用js文件,被 ...

  7. Hbase rowkey设计一

    转自 http://blog.csdn.net/lifuxiangcaohui/article/details/40621067 hbase所谓的三维有序存储的三维是指:rowkey(行主键),col ...

  8. 关于Unity中UI中的Slider,Toggle和InputField等节点

    一.Slider节点 1.创建一个Canvas 2.对Canvas进行一些初始化操作 3.创建一个Image的UI节点在Canvas下面作为子节点 4.把Image铺满整个Canvas,把宽高设置为6 ...

  9. matplotlib中的legend()——用于显示图例

    legend()的一个用法: 当我们有多个 axes时,我们如何把它们的图例放在一起呢?? 我们可以这么做: import matplotlib.pyplot as plt import numpy ...

  10. 有关JSP隐式对象,以下( )描述正确。

    A.隐式对象是WEB容器加载的一组类的实例,可以直接在JSP页面使用 B.不能通过config对象获取ServletContext对象 C.response对象通过sendRedirect方法实现重定 ...