语法 语法: element.事件(function(){}) $ ("div"). click (function(){事件处理程序 } 其他事件和原生基本-致。...事件处理 因为普通注册事件方法的不足,jQuery又开发了多个处理方法,重点讲解如下: on(): 用于事件绑定,目前最好用的事件绑定方法 off(): 事件解绑 trigger().../ triggerHandler(): 事件触发 2.1 事件处理 on() 绑定事件 因为普通注册事件方法的不足,jQuery又创建了多个新的事件绑定方法bind() / live() / delegate...; }); 在此之前有bind0, live0 delegate)等方法来处理事件绑定或者事件委派,最新版本的请用on替代他们。...由此 jQuery 为我们提供了两个自动触发事件 trigger() 和 triggerHandler() ; 语法 第一种: trigger( element.click() // 第一种简写形式
事件(或消息)是一种经常使用的软件设计模式。可以减少消息处理者和消息公布者的之间的耦合,比方J2EE里面的JMS规范。设计模式中的观察者模式(也叫公布/订阅模式)。...之前写的JQuery相关博客中。具体介绍了JQuery的事件处理机制和特性,具体可以參考这个文件夹下的文章。...JQuery事件处理事实上就是使用了公布/订阅模式,包含它提供的命名空间机制、自己定义事件都非常的棒,可是JQuery事件处理有一个缺陷:JQuery事件都是和DOM元素相关的,可是非常多时候我们并不须要...仅仅希望使用事件的公布/订阅这样的机制。 代码1:假设某个DOM元素不存在。那么不能依靠它使用事件的公布和订阅。...它刚好弥补了JQuery事件处理的不足。 以下附上AmplifyJS的源代码amplify.core.js。能够看到源代码非常的简短,也非常easy看懂。 /*!
前言 最近在用Polymer增强form,使其支持表单的异步提交,但发现明明订阅了onsubmit和submit事件,却怎么也触发不了。下面我们将一一道来。...$('form').trigger('submit') 各种提交方式的背后 就onsubmit函数和submit事件而言 方式1,方式2和方式4均可依次调用onsubmit函数和触发submit事件,...因此可以在onsubmit函数或submit事件处理函数中禁止执行默认行为来实现表单的异步提交; 方式3既不会调用onsubmit函数,也不会触发submit事件。...2,若input#name内容为空,则弹出非法内容警告,并阻止表单提交,不执行onsubmit和触发submit事件 方式3,直接提交表单 方式4,若input#name内容为空,不弹出非法内容警告,更不会阻止表单提交..., 而是执行onsubmit和触发submit事件 因此要方式4实现与方式1,2的效果可以这样处理 var e = new Event('submit') var form = document.querySelector
load([[data],fn]) $(window).load(fn); 当页面加载完成 unload([[data],fn]) $(window).unload(fn); 当页面卸载完成后,离开页面时...on()方法绑定事件处理程序到当前选定的jQuery对象中的元素。on汇总了bind和live两种绑定事件的方式。可以支持一般的bind方法或者委托的方法。...on()方法绑定事件处理程序到当前选定的jQuery对象中的元素。on汇总了bind和live两种绑定事件的方式。可以支持一般的bind方法或者委托的方法。...event.stopPropagation() 防止事件冒泡到DOM树上,也就是不触发的任何前辈元素上的事件处理函数。 4....合成事件 6.1 合成鼠标进入和离开的hover方法 jQuery为鼠标进入和离开提供了一个简便的绑定事件的方法hover(enter, leave)。
// $("#btn").trigger('click', ['1234', '3333']); // 触发事件处理程序执行,不触发事件本身 $('#btn').triggerHandler...on()方法绑定事件处理程序到当前选定的jQuery对象中的元素。on汇总了bind和live两种绑定事件的方式。可以支持一般的bind方法或者委托的方法。...方法是 bind()、live() 和 delegate() 方法的新的替代品。...on()方法绑定事件处理程序到当前选定的jQuery对象中的元素。on汇总了bind和live两种绑定事件的方式。可以支持一般的bind方法或者委托的方法。...event.stopPropagation() 防止事件冒泡到DOM树上,也就是不触发的任何前辈元素上的事件处理函数。 4.
1.7开始,on()函数提供了绑定事件处理程序所需的所有功能,用于统一取代以前的bind()、 delegate()、 live()等事件函数。 ...$().delegate()是更精确的小范围的使用事件代理。 $().on()结合了这三个方法的优势摒弃了劣势。 2.该函数可以为同一元素、同一事件类型绑定多个事件处理函数。...触发事件时,jQuery会按照绑定的先后顺序依次执行绑定的事件处理函数。 3. 阻止事件冒泡和事件委托的方法: A:return false。 ...在事件的处理中,可以阻止默认事件和冒泡事件。 B:event.preventDefault() 在事件的处理中,可以阻止默认事件但是允许冒泡事件的发生。 ...在事件的处理中,可以阻止冒泡但是允许默认事件的发生。 总结 在写web前端的时候,一些基础知识还是要去打扎实,不然写的时候会发现各种困难。
6,delegate delegate()函数用于为指定元素的一个或多个事件绑定事件处理函数。 即使是执行delegate()函数之后新添加的元素,只要它符合条件,绑定的事件处理函数仍然对其有效。...从jQuery 1.7开始,on()函数提供了绑定事件处理程序所需的所有功能,用于统一取代以前的bind()、 delegate()、 live()等事件函数。...click"); /*(追加文本) 触发元素#btn1的[click]事件,额外的函数参数为:undefined, undefined */ 13,load jQuery 1.0 新增该函数,但从1.8...这里介绍的load()是一个事件函数,jQuery中还有一个同名的Ajax函数load(),用于通过Ajax加载html文档内容。...实例: 现在,我们为window对象的resize事件绑定处理函数(可以绑定多个,触发时按照绑定顺序依次执行): $(window).resize( function(){ alert("不建议调整窗口大小
JQuery的delegate事件: delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。...使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。...$(selector ).delegate(childSelector ,event ,data ,function ) 注意了 : delegate是用在父子元素之间的一个事件,意思就是说childselector...如: jquery/jquery.js”> 不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
jquery和Dom对象相互转换: dom--->jquery :$(dom对象).../jquery/jquery_ref_dom_element_methods.asp jQuery事件:http://www.w3school.com.cn/jquery/jquery_ref_events.asp...$(function(){})是$("document").ready(function(){})的简写 3.ajax ajax可以通过ajax库和jquery(jquery有ajax封装)完成...1.XMLHttpRequest 是 AJAX 的基础 2.jQuery ajax :$.load , $.get , $.post 等 4.JavaScript(ES6...:bind\delegate\live\on----unbind\undelegate\die\off bind添加数据到document;delegate效率最高存数据,执行需要查询
jQuery的.on()、.bind()、.live()和.delegate()之间的区别并非总是那么明显的,然而,如果我们对所有的不同之处都有清晰的理解的话,那么这将会有助于我们编写出更加简洁的代码,...现在我们可以较容易地说明.on()、.bind()、.live()和.delegate()的不同之处了。...版本以下支持,jquery1.9及其以上版本删除了此方法,jquery1.9以上版本用on()方法来代替 $(selector).delegate(childSelector,event,data...;jquery1.7版本出现之后用于替代bind(),live()绑定事件方式; event 必需项;添加到元素的一个或多个事件,例如 click,dblclick等; 单事件处理:例如 $(selector...而和.live()相同的地方在于都是用event delegation; 优点 你可以选择把事件绑定到对应的元素上 chaining被正确的支持了 jQuery仍然需要迭代查找所有的selector/event
库内部已经做了各种底层的封装,以及各种兼容问题的处理,工作中调用库内的API接口就能实现需要的功能,不需要额外的代码来处理函数封装和兼容问题,让代码更简洁,效率更高。...ubind() 适用于任何通过 jQuery 附加的事件处理程序。...Paste_Image.png delegate:用于事件代理,为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数;适用于当前或未来的元素(比如由脚本创建的新元素...自 jQuery 版本 1.7 起,on() 方法是 bind()、live() 和 delegate() 方法的新的替代品。该方法给 API 带来很多便利,简化了 jQuery 代码库。...注意:on的事件代理和delegate的事件代理,写法不一样,子元素和事件监听函数的位置不同 //on的事件代理 $("ul").on("click", "li", function() {
jQuery版本: 1.x版本: 能够兼容IE678浏览器 2.x版本: 不兼容IE678浏览器 1.x和2.x版本的jQuery都不再更新版本了,现在只更新3.x版本...事件进行了封装,增加并扩展了事件处理机制, jQuery不仅提供了更加优雅的事件处理语法 ,而且极大的增强了事件处理的能力. 2.1 简单事件绑定>>bind事件绑定>>delegate事件绑定...; 2.5 jQuery事件对象 jQuery事件对象其实就是对JS事件对象的一个封装,处理了兼容性的问题 screenX和screenY:对应屏幕最左上角的值 clientX和...1.jQuery load()方法: load() 方法从服务器加载数据,并把返回的数据放入被选元素中....,缩短每个步骤的处理时间从而提升整个资源的访问和呈现速度.
常见 DOM 事件: 鼠标事件 键盘事件 表单事件 文档/窗口事件 click keypress submit load dblclick keydown change resize mouseenter...注意:自 jQuery 版本 1.7 起,on() 方法是 bind()、live() 和 delegate() 方法的新的替代品。...规定只能添加到指定的子元素上的事件处理程序(且不是选择器本身,比如已废弃的 delegate() 方法)。 data 可选。规定传递到函数的额外数据。 function 可选。...jQuery凭借简洁的语法和跨平台的兼容性,极大地简化了JavaScript开发人员遍历HTML文档、操作DOM、处理事件、执行动画和开发Ajax。...该方法给 API 带来很多便利,我们推荐使用该方法,它简化了 jQuery 代码库。 注意:如需移除指定的事件处理程序,当事件处理程序被添加时,选择器字符串必须匹配 on() 方法传递的参数。
varcached = jQuery('#top'); cached.find('p.classA'); cached.find('p.classB'); 根据测试,缓存比不缓存,快了2-...事件的委托处理(EventDelegation) javascript的事件模型,采用"冒泡"模式,也就是说,子元素的事件会逐级向上"冒泡",成为父元素的事件。...因此,这个事件只需要在父元素绑定1次即可,而不需要在子元素上绑定100次,从而大大提高性能。这就叫事件的"委托处理",也就是子元素"委托"父元素处理这个事件。 具体的写法有两种。...唯一的区别在于,.delegate()是当事件冒泡到指定的父元素时触发,.live()则是当事件冒泡到文档的根元素后触 发,因此.delegate()比.live()稍快一点。...根据测试,委托处理比不委托处理,快了几十倍。在委托处理的情况下,.delegate()又比.live()大约快26%。 8.
= jQuery('#top'); cached.find('p.classA'); cached.find('p.classB'); 根据测试,缓存比不缓存,快了2-3倍。...事件的委托处理(EventDelegation) javascript的事件模型,采用"冒泡"模式,也就是说,子元素的事件会逐级向上"冒泡",成为父元素的事件。 利用这一点,可以大大简化事件的绑定。...因此,这个事件只需要在父元素绑定1次即可,而不需要在子元素上绑定100次,从而大大提高性能。这就叫事件的"委托处理",也就是子元素"委托"父元素处理这个事件。 具体的写法有两种。...唯一的区别在于,.delegate()是当事件冒泡到指定的父元素时触发,.live()则是当事件冒泡到文档的根元素后触发,因此.delegate()比.live()稍快一点。...根据测试,委托处理比不委托处理,快了几十倍。在委托处理的情况下,.delegate()又比.live()大约快26%。 8.
事件变更中心收到该事件之后,会往队列中加入事件。...此时 dataChangeEventCenter 会根据不同的事件类型异步地对上下线数据进行相应的处理,即把这个事件变更信息变成ChangeNotifier ,进而变成Operator,放到AbstractAcceptorStore...,针对每一个ChangeData,调用notifyExecutor的一个工作线程,生成一个ChangeNotifier进行处理。...(changeData, name)); } }); } } 3.2.4 业务执行 对于 ChangeData,会生成 ChangeNotifier 进行处理...会把这个事件变更信息通过 ChangeNotifier 对外发布,通知其他节点进行数据同步。 在 ChangeNotifier 之中,会判断changeData的类型做不同处理。
第8章 jQuery事件机制 JavaScript中已经学习过了事件,jQuery对JavaScript事件进行了封装,增加并扩展了事件处理机制。...jQuery不仅提供了更加优雅的事件处理语法,而且极大的增强了事件的处理能力。...8.1 jQuery事件发展历程(了解) 简单事件绑定–bind事件绑定–delegate事件绑定–on事件绑定(推荐) 简单事件注册 click(handler) 单击事件 mouseenter(...}); 8.2 on注册事件(重点) jQuery1.7之后,jQuery用on统一了所有事件的处理方法。...jQuery事件对象其实就是js事件对象的一个封装,处理了兼容性。
jQuery事件机制 JavaScript中已经学习过了事件,但是jQuery对JavaScript事件进行了封装,增加并扩展了事件处理机制。...jQuery不仅提供了更加优雅的事件处理语法,而且极大的增强了事件的处理能力。...jQuery事件发展历程(了解) 简单事件绑定>>bind事件绑定>>delegate事件绑定>>on事件绑定(推荐) 简单事件注册 click(handler) //单击事件...}); 缺点:只能注册委托事件,因此注册时间需要记得方法太多了 on注册事件 on注册事件(重点) jQuery1.7之后,jQuery用on统一了所有事件的处理方法。...$(selector).trigger("click"); jQuery事件对象 jQuery事件对象其实就是js事件对象的一个封装,处理了兼容性。
*****************************/ $(function(){ //jQuery代码 }); 选择器语法: jQuery的选择器语法格式和CSS的调用方法一样的哦!...、或将函数绑定到指定元素的 double click 事件 | |delegate() |向匹配元素的当前或未来的子元素附加一个或多个事件处理器 | |die() |移除所有通过...live() 函数添加的事件处理程序。...|live() |为当前或未来的匹配元素添加一个或多个事件处理器 | |load() |触发、或将函数绑定到指定元素的 load 事件 | |mousedown...|从匹配元素移除一个被添加的事件处理器 | |undelegate() |从匹配元素移除一个被添加的事件处理器,现在或将来 | |unload() |触发、或将函数绑定到指定元素的
支持为动态生成的标签元素绑定事件也许就live和delegate了吧,不过新版本已经不支持live了,只有delegate delegate真的比较特殊呀,不同于其他事件绑定的风格。...delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。...使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。...规定要附加事件处理程序的一个或多个子元素。 event 必需。规定附加到元素的一个或多个事件。 由空格分隔多个事件值。必须是有效的事件。 data 可选。规定传递到函数的额外数据。...比如这段小代码啊 jquery/jquery.js"> <script type=