今天看到一篇jquery 事件的文章,自己写了个小例子,虽然2种方式都可以实现,但是不太明白,找了点资料 $("#box1").delegate("p","click",function(e){//函数绑定到容器 alert(this.id) }) $("#box1 p").click(function(e){ alert(this.id) }) 博客链接 : http://www.cnblogs.com/zagelover/…

本篇文章主要是对jQuery中live与bind方法的区别进行了详细的分析介绍,需要的朋友可以过来参考下,希望对大家有所帮助 注意如果是通过jq添加的层和对象一定要用live(),用其他的都不起作用 live的缺点就是,运行完以后不释放空间,太多的使用会占用更多的内存,bind()则点击完以后释放空间 区别一: Click here 可以给这个元素绑定一个简单的click事件: $('.clickme').bind('click', function() { $('body').append('…

一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaScript对象属性进行绑定: var a=document.getElementById("a"); a.onclick=function(){alert("你好!")};//这里也可以不用匿名的函数直接赋方法名也是可以的 通过以上这种方式进行事件函数的绑定有个缺点就是…

我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 1.准备知识 当我们在开始的时候,有些知识是必须具备的: 1).DOM树 下图仅仅是一个示例,这是一个在browser环境下的一棵模拟DOM树,在下面的代码中仅起到演示的作用: 2).Event bubbling (aka event propagation)冒泡 我们的页面可以理解为一棵DOM树,当我们在叶子结点上做什么事情的时候(如click一个a元素)…

1.bind    jquery 1.3之前 定义和用法:主要用于给选择到的元素上绑定特定事件类型的监听函数 语法:  bind(type,[data],function(e)); 特点: a.适合页面元素静态绑定,只能调用已经存在的元素绑定事件 b.当页面加载完后,才可以进行bind(),  所以有可能产生效率问题 $("#box").bind("click",function(e){ $(this).css({"width":"20…

1.bind()方法 (只能给已经存在的元素上绑定事件) 只能给调用它的时候已经存在的元素绑定事件,不能给未来新增的元素绑定事件. $('ul li').bind('click', function(){ $(this).addClass('active').siblings().removeClass('active'); }); 2.live()方法(绑定到document DOM节点上.和.bind()的优势是支持动态数据) jQuery 1.3新增的.live()方法代替.bind()方…

Js的功能确实非常强大,奈何我一个php程序员一直在js上没有投入足够的精力去研究,每次遇到不会的都是去百度,以后有时间真的应该买本书系统的学习一下 // Bind $( "#members li a" ).on( "click", function( e ) {} ); $( "#members li a" ).bind( "click", function( e ) {} ); // Live $( document ).…

.click与.bind .click和.bind都是给每个元素绑定事件,对于只绑定一个click事件,.bind事件的简写就是.click那种方式. 这两种方式都会出现两个问题: 第一个问题,如果要绑定的事件特别多,比如要绑定100个元素,要绑定100次,对于大量元素来说,影响到了性能.但是如果是id选择器,因为id唯一,用bind()方法就很快捷了. 第二个问题,对于尚未存在的元素,无法绑定.动态添加一个span元素,点击这个span元素,会发现没有动作响应. 那么你就会问,为什么要出现.b…

1.bind方法绑定的事件处理函数不会应用到后来添加到DOM中的新元素.比如你在用bind给页面元素绑定事件之后,又新添加了一些与之前绑定过事件的元素一样的DOM元素,但是这些事件并不能在新的DOM元素上有体现. 如: $(document).ready(function(){ $("img").bind({ mouseenter:function(){ $(this).css("border","thick solid red"); }, mo…

1 首先bind()方法是最直观的,但是也是弊端最大的. $('a').bind('click',function(){alert('that tickles!')}) 这和事件冒泡有直接关系,当我们点击了<a></a>标签时,会立马执行alert,但与此同时,click()事件会接着向DOM树的根方向传播,广播到父元素,由父元素向上到每个祖先元素,只要是它的某个后代元素上的click()事件被触发,那么整个dom树都会牵一发而动全身.所以对未来元素的绑定不能用bind. 2 li…

本篇文章介绍了,关于jQuery新的事件绑定机制on()的使用技巧.需要的朋友参考下   今天浏览jQuery的deprecated列表,发现live()和die()在里面了,赶紧看了一下,发现从jQuery1.7开始,jQuery引入了全新的事件绑定机制,on()和off()两个函数统一处理事件绑定.因为在此之前有bind(), live(), delegate()等方法来处理事件绑定,jQuery从性能优化以及方式统一方面考虑决定推出新的函数来统一事件绑定方法并且替换掉以前的方法. on(e…

jQuery中绑定事件的四种方法,他们可以同时绑定一个或多个事件 bind()-------------------------版本号小于3.0(在Jquery3.0中已经移除,相应unbind()也移除) live()--------------------------版本号小于1.7(在Jquery1.7中已经移除,相应die()也移除) delegate()-------------------版本号小于1.7(在Jquery1.7中已经移除) on()------------------…

摘自:https://www.cnblogs.com/moonreplace/archive/2012/10/09/2717136.html moonreplace这位大牛的 当我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 准备知识: 当我们在开始的时候,有些知识是必须具备的: DOM树 下图仅仅是一个示例,这是一个在browser环境下的一棵模拟DOM树,在下面的代码中仅起到演示的作用: Event…

原文:http://www.jquery001.com/click%28%29-bind%28%29-live%28%29-delegate%28%29.html click(),bind(),live()都是执行事件时使用的方法,他们之前是有一些区别的,我们在使用这些方法时应该根据需要进行选择. 1.click()方法是我们经常使用的单击事件方法: $("a").click(function(){ alert("hello");}); 当点击<a>时,…

jquery事件绑定bind:向匹配元素添加一个或多个事件处理器 $(selector).bind("click",data,function); live:向当前或未来的匹配元素添加一个或多个事件处理器 单事件处理:例如 $(selector).live("click",data,function); 支持jquery1.8+ delegate:支持jquery1.4.2+ on:为指定的元素,添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数. 使用…

转自:http://www.zhufengpeixun.cn/jquery/bind_type_data_fn.html bind(type, [data], fn)  返回值::jQuery 概述 为每个匹配元素的特定事件绑定事件处理函数. .bind() 方法是用于往文档上附加行为的主要方式.所有JavaScript事件对象,比如focus, mouseover, 和 resize,都是可以作为type参数传递进来的. jQuery还提供了一些绑定这些标准事件类型的简单方式,比如.click…

浏览器的事件模型 由网景公司引入的 DOM0 级事件模型 把事件处理程序绑定到 DOM 元素的属性上: ele.onclick(); ele.onDOMContentLoad(); ele.onload(); ele.onmousemove(); 解绑: ele.onclick = null; 取消事件冒泡 return false; 缺点:如果同一元素绑定多个同类型的事件处理程序,只有最后一个生效. W3C 定义的 DOM2 级事件模型 w3c 定义了两个方法来操作事件 绑定事件 addEve…

1.区别: bind方式,进入外部区域和内部区域都会触发相关方法(methodA 或methodB): hover方式,进入内部区域不会再触发相关方法. 2.example: <body>    <div class="outer" id="outer1">      Outer 1      <div class="inner" id="inner1">Inner 1</div>…

this指的是原生js的DOM对象 .css(“”):只写一个值是取值,写俩值是赋值 window.onload   ===   $(document).ready(); $(“”):获取元素   标签名..类名.#id jQuery特点 链式编程 jq.shou(3000).html(内容) 相当于 jq.shou(3000) jq.gtml(内容) 隐式迭代 隐式实用for循环.迭代 如何使用jQuery 引包 一定要在使用之前 <script src = ‘’><> 入口函数…

原文地址:https://blog.csdn.net/whuzxq/article/details/64166253 由于在理解this的用法的时候多次出现了这几个方法,个人对这几个方法理解的不是很透彻,因此拿出来整理一下.关于this的用法,可移步至如下网址查看: [Web]Javascript中的this陷阱(一) http://blog.csdn.net/whuzxq/article/details/63265901 [Web]Javascript中的this陷阱(二) http://bl…

jQuery目前有on(),bind(),delegate(),live()四种绑定方式,但是随着版本的不断更新,有的方式也相应的被淘汰掉 [band()方式绑定] 3.0版本之前的绑定方式比较常用的是bind()绑定事件,解除事件的方式是unbind(),但是在3.0之后band()的绑定方式也别相应的解除掉了.bind()的事件绑定是只对当前页面选中的元素有效.如果你想对动态创建的元素bind()事件,是没有办法达到效果的,如下代码. <body> <button id="…

事件(Event)是JavaScript应用跳动的心脏,通过使用JavaScript ,你可以监听特定事件的发生,并规定让某些事件发生以对这些事件做出响应 事件的基础就不重复讲解了,本来是定位源码分析实现的, 所以需要有一定的基础才行 为了下一步更好的理解内部的实现,所以首先得清楚的认识到事件接口的划分 网上资料遍地都是,但是作为一个jQuery系列的源码分析,我还是很有必要在重新总结一下 jQuery对事件的绑定分别有几个API http://www.css88.com/jqapi-1.9/…

jQuery最新版建议:最好用on来代替以前的bind, live, delegate,其中live是最不建议使用的. on和off的格式 on $(elements).on(events[, selector][, data],handler);//格式一 $(elements).on(eventsMap[, selector][, data]); //格式二 例如: $('#container a').on({ click: function(){ event.preventDefault(…

传统的时间处理: 给某一个元素绑定一个点击事件,传入一个回调句柄处理 element.addEventListener('click',doSomething,false); 这样的绑定如果页面上面有几百个需要绑定,那么就要绑定几百多次. 问题: 大量的事件绑定,性能消耗,而且还需要解绑(IE会泄露) 绑定的元素必须要存在. 后期生成HTML会没有事件绑定,需要重新绑定. 语法过于繁杂 事件委托 DOM有个事件流的特性,在页面上触发节点的时候事件都会上下或者向上传播,事件捕捉和事件冒泡. 事件传…

啃了一段日子的js相关了,学的过程中发现在jQuery中绑定事件时,有人用bind(),有人用on(),有人用delegate(),还有人用live(),看代码的时候觉得都实现功能了也就掀过去了,只是一直没完全弄懂之间的区别,于是今天查了下资料,自己做个总结. 之所以有这么多类型的绑定方法,是因为jQuery的版本更新的原因,如on()方法就是1.7以后出现的. jQuery的事件绑定api页面上,提到live()方法已经过时,不建议使用.所以这里我们主要就看下以下三个方法: bind() de…

简介 最近了解到很多网页开发者对jquery中的 .bind() .live() .delegate() 和 .on() 方法存在很多的疑惑.这些疑惑通常是关于它们之间真正的区别是什么啊,什么时候该使用它们啊.下面本文将给大家详细介绍这四个方法之间的区别,分别对每个方法都进行了详细的介绍,话不多说,来一起看看详细的介绍: 在我们深入了解这些方法之前,我们先来一段常见的的HTML,作为我们编写jquery示例方法使用的样本. ? 1 2 3 4 5 6 7 8 9 10 11 <ul id="…

jquery中on/delegate的原理 早期版本中叫delegate, 后来有过live函数,再后来统一用on.下面的方法等效: // jQuery 1.3 $(selector).(events, data, handler); // jQuery 1.4.3+ $(elements).delegate(selector, events, data, handler); // jQuery 1.7+ live过时 旧版本的jQuery中用户,应优先使用.delegate()来取代.live…

bind()函数用于为每个匹配元素的一个或多个事件绑定事件处理函数. 此外,你还可以额外传递给事件处理函数一些所需的数据. 执行bind()时,事件处理函数会绑定到每个匹配元素上.因此你使用bind()所有button元素绑定了click事件,是为当时文档中存在的每个button元素绑定click事件.如果之后你向文档中添加了新的button元素,绑定事件不会对其生效.如果你希望绑定事件对未来新添加的元素也生效,请使用on().delegate().live()等事件函数(尽量优先使用靠前的事件…

1. jQuery 事件 - delegate() 方法 定义和用法 delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数. 使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素). $("div").delegate("button","click",function(){ $("p").slideToggle();…

delegate()函数用于为指定元素的一个或多个事件绑定事件处理函数. 此外,你还可以额外传递给事件处理函数一些所需的数据. 即使是执行delegate()函数之后新添加的元素,只要它符合条件,绑定的事件处理函数仍然对其有效. 此外,该函数可以为同一元素.同一事件类型绑定多个事件处理函数.触发事件时,jQuery会按照绑定的先后顺序依次执行绑定的事件处理函数. 要删除通过delegate()绑定的事件,请使用undelegate()函数. 从jQuery 1.7开始,请优先使用事件函数on()…