事件click，bind，click

jquery阻止冒泡事件：$('span').bind("click",function(event){event.stopPropagation();})（有用源）

冒泡事件就是点击子节点,会向上触发父节点,祖先节点的点击事件. <body> <div id="content"> 外层div元素 <span>内层span元素</span> 外层div元素 </div> <div id="msg"></div> </body> <script type="text/javascript"> $(funct…

jQuery绑定事件方法及区别(bind,click,on,live,one)

第一种方式: ? 1 2 3 4 5 $(document).ready(function(){ $("#clickme").click(function(){ alert("hello world click") }) }) 第二种方式(简写方式为第一种): ? 1 2 3 $('#clickmebind').bind("click", function(){ alert("Hello World bind"); }…

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

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

jquery 事件委托绑定click的使用方法

直接绑定ul的click事件代码如下复制代码 $("ul").click(function(e) 例子代码如下复制代码 $(function(){ //$("ul").on('click',this,function(e){ $("ul").click(function(e){ $target = $(e.target); if ($target.is("h3")) { alert("h3&quo…

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

今天看到一篇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方法区别(四)click() bind() live() delegate()区别

click(),bind(),live()都是执行事件时使用的方法,他们之前是有一些区别的,我们在使用这些方法时应该根据需要进行选择. 1.click()方法是我们经常使用的单击事件方法: $("a").click(function() { alert("hello"); }); 当点击<a>时,输出hello. 2.click()方法是bind()方法的一种简单方法.在bind()中,jQuery所有JavaScript事件对象,比如focus…

jquery .live() .delegate() .bind() .click()区别

什么是.live()? 除了让你对Dom元素现在和将来绑定事件之外,.live() 方法和.bind()方法很像.你可以用.live()方法对没有存在的Dom节点绑定事件.考虑下面的情况. 当用户要离开你的站点时,点击任何连接,你可以警告他: ? 1 2 3 4 5 6 $(document).ready( function() { $('a').click( function() { alert("You are now leaving this site"); …

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(&q…

one(type,[data],fn) 为每一个匹配元素的特定事件（像click）绑定一个一次性的事件处理函数。

one(type,[data],fn) 概述为每一个匹配元素的特定事件(像click)绑定一个一次性的事件处理函数. 在每个对象上,这个事件处理函数只会被执行一次.其他规则与bind()函数相同.这个事件处理函数会接收到一个事件对象,可以通过它来阻止(浏览器)默认的行为.如果既想取消默认的行为,又想阻止事件起泡,这个事件处理函数必须返回false. 多数情况下,可以把事件处理函数定义为匿名函数(见示例一).在不可能定义匿名函数的情况下,可以传递一个可选的数据对象作为第二个参数(而事件处理函数则…

当一个HTML元素需要添加mouseon、mouseout与click事件，或者mouserenter、mouseleave和click事件时，click事件无法触发

当一个HTML元素需要添加mouseon.mouseout与click事件,或者mouserenter.mouseleave和click事件时,click事件无法触发针对上述问题,我遇到的有两种情况: 情况一:已经存在的HTML元素绑定事件,可以使用下面这种绑定方式 $("button").mouseon(function(){ $("p").text("滑入"); }).click(function(){ $("p").t…

Vue之@click、事件修饰符@click.stop与@click.prevent、按键修饰符@keyup.enter

1.绑定监听@click: (以监听click为例,其他如keyup,用法类似) v-on:click="fun" @click="fun" @click="fun(参数)" <button @click="test1">test1</button> <button @click="test2('abc')">test2</button> <but…

jQuery 2.0.3 源码分析事件绑定 - bind/live/delegate/on

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

原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别

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

转载： jQuery事件委托( bind() \ live() \ delegate()) [委托和绑定的故事]

转载:http://blog.csdn.net/zc2087/article/details/7287429 随着DOM结构的复杂化和Ajax等动态脚本技术的运用,事件委托自然浮出了水面.jQuery为绑定和委托事件提供了.bind()..live()和.delegate()方法.本文在讨论这几个方法内部实现的基础上,展示它们的优劣势及适用场合. 事件委托事件委托的事例在现实当中比比皆是.比如,有三个同事预计会在周一收到快递.为签收快递,有两种办法:一是三个人在公司门口等快递:二是委托给前台M…

jQuery事件函数bind,live,delegate的区别

DOM树首先,可视化一个HMTL文档的DOM树是很有帮助的.一个简单的HTML页面看起来就像是这个样子: 事件冒泡(又称事件传播) 当我们点击一个链接时,其触发了链接元素的单击事件,该事件则引发任何我们已绑定到该元素的单击事件上的函数的执行. ~~~事件冒泡又称事件传播 $('a').bind('click', function() { alert("That tickles!") }); 因此一个单击操作会触发alert函数的执行. click事件接着会向树的根方向传播,广播到父元…

jQuery中对未来的元素绑定事件用bind、live or on

对未来的元素绑定事件不能用bind, 1.可以用live代替,但是要注意jquery的版本,根据官方文档,从1.7开始就不推荐live和delegate了,1.9里就去掉live了. 2.推荐用on代替(注:1.7及以上的版本才支持).用法:on(events,[selector],[data],fn) 代码如下: //放在$(function(){})里才有效 $(document).on("click", "#testDiv", function(){ //此处…

JQuery中绑定事件（bind()）和移除事件（unbind()）

有时候事件执行完了,想取消事件的效果可以通过一定的办法来处理.比如bind()(绑定事件)和unbind()(移除通过bind()方法添加的事件)方法来移除事件的效果. 比如下面的一个案例: 复制代码代码如下: <script type="text/javascript"> $(function(){ $('#btn').bind("click", function(){ $('#test').a…

jQuery事件：bind、delegate、on的区别

最近在AngularJS的开发中,遇到一个神奇的事情:我们用到livebox来预览评论列表中的图片, 然而评论列表是由Angular Resource动态载入的.不可思议的是,点击这些动态载入的图片仍然会触发lightbox的图片预览. 难道lightbox使用先进的MutationObserver技术监听了DOM的变化?观察lightbox源码才发现,原来只是jQuery的.on()方法: $('body').on('click', 'a[rel^=lightbox], ...', funct…

jQuery - 03. each、prevaAll、nextAll、获取属性、修改属性attr／val／text（）、jq.height/width、offset().／position().／scrol Left／Top 、事件绑定bind、delegate、on、事件解绑、事件对象、多库共存

each 方法 $ ( selector).each(function( index,element) { } ); 参数一表示当前元素在所有匹配元素中的索引号参数二表示当前元素(DOM对象) prevAll("li") 同个父系中前边所有的li元素 nextAll("li")同个父系后边所有的li元素 jQuery(function () { //设置不一样的盒子透明度逐渐递增 $("ul li").each(function (ind…

关于jquery的事件委托-bind，live，delegate，on的区别发展

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