jQuery性能:$('#selector').live()vs手动绑定(当使用ajax请求时) - 腾讯云开发者社区

文章/答案/技术大牛

发布

事件绑定的几种常见方式

1.事件绑定的几种常见方式（以click事件为例） jquery: $(selector).click(function(){...})...[注意：live事件，jQuery 1.7以后版本使用on代替live，且移动设备safari浏览器不支持live事件] 【穿插解决方案：移动设备safari浏览器不支持live事件方法一：首先要给绑定...　　唯一的区别在于delegate的性能会比live稍好一些，因为live方法需要遍历整个dom去查selector而delegate只需要监测document就够了，想要更深入了解可以自己去网上查阅下...2.事件重复绑定的可能原因大量使用ajax 　　将所有事件写在一个大方法里，如： var clickEvent = function(){ $(a).bind(...); $(b).bind...(...); } 　　在大量使用ajax时，为了触发事件会在success里调用clickEvent方法，然后由于其他地方需要触发同样的事件又会调用clickEvent，这样很容易导致多次触发。

2.1K8 0

jQuery 升级踩坑大全

使用了被废弃的jQuery.fn.live方法 jQuery Migrate库对此错误也在控制台有相应的警告： JQMIGRATE: jQuery.fn.live() is deprecated live...他们的接口分别是： $(selector).live('click', function(){/* some code */}); $(selector).on('click', [selector,]...但是如果在你调用on函数的时候，前面的$(selector)在当前的网页上根本不匹配任何元素（该元素可能是后面的代码才加到DOM里的），那是不会绑定成功的。...事实上，live函数将$(selector)代理到了document元素上，这个元素是肯定存在的，所以不会出现类似情况。...AJAX全局事件必须绑定到document节点上 jQuery Migrate中的警告如下： JQMIGRATE: AJAX events should be attached to document:

4.3K9 0

您找到你想要的搜索结果了吗？

是的

没有找到

jQuery 快速入门教程

当使用上述插入、追加、替换、删除方法时，如果用于插入/追加/替换/删除的元素是文档中的元素，则这些元素将从原位置上消失。...触发click事件时，将按照绑定顺序依次执行每个处理函数。...live()方法绑定的处理函数 $("selector").die("click"); //主要用于解除通过delegate()方法绑定的处理函数 $(document).undelegate("selector...jQuery核心：Ajax jQuery还对Ajax进行了封装了，我们可以非常方便地发送一个Ajax请求，并对响应进行处理。...); } }); $.ajax()是是jQuery中Ajax的底层实现，其它Ajax请求方法都是基于该方法实现的。

15.2K3 0

jQuery学习笔记

8.7K3 0

jQuery 重点解析 write less,but do more

.ajaxComplete() 当 Ajax 请求完成时注册要调用的处理程序。这是一个 Ajax 事件。....ajaxStart() 当首个 Ajax 请求完成开始时注册要调用的处理程序。这是一个 Ajax 事件。....ajaxStop() 当所有 Ajax 请求完成时注册要调用的处理程序。这是一个 Ajax 事件。....ajaxSuccess() 当 Ajax 请求成功完成时显示一条消息。 jQuery.get() 使用 HTTP GET 请求从服务器加载数据。...jQuery.param() 创建数组或对象的序列化表示，适合在 URL 查询字符串或 Ajax 请求中使用。

1.9K2 0

jQuery中on()、bind()、live()、delegate()之间的区别

，不能给事件单独绑定函数,适合处理多个事件调用同一函数情况；大括号替代方式：绑定较为灵活，可以给事件单独绑定函数； data 可选；需要传递的参数； function 必需项；当绑定事件发生时，需要执行的函数...它会绑定事件到所有的选出来的元素上它不会绑定到在它执行完后动态添加的那些元素上当元素很多时，会出现效率问题当页面加载完的时候，你才可以进行bind()，所以可能产生效率问题 2 .live()...Chaining没有被正确的支持当使用event.stopPropagation()是没用的，因为都要到达document 因为所有的selector/event都被绑定到document, 所以当我们使用...而不是document上，像这样： $('a', $('#container')).live(...); 3 .delegate() .delegate()则是更精确的小范围使用事件代理，性能优于...而和.live()相同的地方在于都是用event delegation; 优点你可以选择把事件绑定到对应的元素上 chaining被正确的支持了 jQuery仍然需要迭代查找所有的selector/event

1.7K3 0

jQuery基础(五)一Ajax应用与常用插件-imooc

使用ajax()方法加载服务器数据使用ajax()方法是最底层、功能最强大的请求服务器数据的方法，它不仅可以获取服务器返回的数据，还能向服务器发送请求并传递数值，它的调用格式如下： jQuery.ajax...使用ajaxSetup()方法设置全局Ajax默认选项使用ajaxSetup()方法可以设置Ajax请求的一些全局性选项值，设置完成后，后面的Ajax请求将不需要再添加这些选项值，它的调用格式为： jQuery.ajaxSetup...它们的调用格式为： $(selector).ajaxStart(function())和$(selector).ajaxStop(function()) 其中，两个方法中括号都是绑定的函数，当发送Ajax...请求前执行ajaxStart()方法绑定的函数，请求成功后，执行ajaxStop ()方法绑定的函数例如，由于使用ajaxStart()和ajaxStop()方法绑定了动画元素，因此，在开始发送Ajax...，当这个jQuery UI插件与元素绑定后，可以通过调用draggable()方法，实现各种拖曳元素的效果，调用格式如下： $(selector). draggable({options}) options

18.9K2 0

jQuery

当Jquery名称冲突时，可以利用var jq = jQuery.noConflict()来使用jq代替表示Jquery。...Event 函数绑定函数至 $(document).ready(function) 将函数绑定到文档的就绪事件（当文档完成加载时） $(selector).click(function) 触发或将函数绑定到被选元素的点击事件...method：请求的类型；GET 或 POST url：文件在服务器上的位置 async：true（异步，使用Ajax时必须）或 false（同步） send(string) 将请求发送到服务器。...} xmlhttp.open("GET","/example/xmle/books.xml",true); xmlhttp.send(); } 4. onreadystatechange 事件当请求被发送到服务器时...AJAX & ASP/PHP/DB/XML 通过标签绑定事件，绑定函数在服务器响应就绪时调用函数，发送HTTP请求，访问asp/php文件，文件中对数据库进行查询。

18.2K2 0

jQuery on()方法

绑定click事件，使用jquery的$().click(func)？别闹了，属实是low。虽然之前在ajax回调成功后通过dom添加过元素，遇到过这种情况，事件绑定会失效。...jQuery on()方法是官方推荐的绑定事件的一个方法。...$().on()的知识点补充：　　1.从jQuery 1.7开始，on()函数提供了绑定事件处理程序所需的所有功能，用于统一取代以前的bind()、 delegate()、 live()等事件函数。...2.该函数可以为同一元素、同一事件类型绑定多个事件处理函数。触发事件时，jQuery会按照绑定的先后顺序依次执行绑定的事件处理函数。　　3....时已经取消使用live()方法了，所以建议都使用on()方法。

1.3K1 0

jQuery ajax - ajax()方法

简短地说，在不重载整个网页的情况下，AJAX 通过后台加载数据，并在网页上进行显示。使用 AJAX 的应用程序案例：谷歌地图、腾讯微博、优酷视频、人人网等等。...关于 jQuery 与 AJAX jQuery 提供多个与 AJAX 有关的方法。...通过 jQuery AJAX 方法，您能够使用 HTTP Get 和 HTTP Post 从远程服务器上请求文本、HTML、XML 或 JSON - 同时您能够把这些外部数据直接载入网页的被选元素中。...$(selector).load(URL,data,callback); 必需的 URL 参数规定您希望加载的 URL。可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。...HTTP 请求：GET vs. POST 两种在客户端和服务器端进行请求-响应的常用方法是：GET 和 POST。

10.6K2 0

前端架构师之01_JQuery

在jQuery中则可直接使用其提供的与事件类型同名的方法。例如，点击事件对应的方法为click()。这些事件方法允许重复绑定处理程序，按照绑定顺序依次执行。若省略参数，则表示触发事件。...jQuery官方推荐使用on()方法进行事件绑定，在新版本中已经取代了bind()、delegate()和live()方法。...选项名称说明 url 处理Ajax请求的服务器地址 data 发送Ajax请求时传递的参数，字符串类型 success Ajax请求成功时所触发的回调函数 type 发送的HTTP请求方式，如get、...事件 ajaxComplete(fn) Ajax请求完成时触发的事件执行函数 Ajax事件 ajaxError(fn) Ajax请求发生错误时触发的事件执行函数 Ajax事件 ajaxSend(fn)...Ajax请求发送前触发的事件执行函数 Ajax事件 ajaxStart(fn) Ajax请求开始时触发的事件执行函数 Ajax事件 ajaxStop(fn) Ajax请求结束时触发的事件执行函数 Ajax

2.9K0 0

jquery学习

事件下面是 jQuery 中事件方法的一些例子： Event 函数绑定函数至 $(document).ready(function) 将函数绑定到文档的就绪事件（当文档完成加载时） $(selector...(function) 触发或将函数绑定到被选元素的获得焦点事件 $(selector).mouseover(function) 触发或将函数绑定到被选元素的鼠标悬停事件 jQuery 事件方法方法...//虽然jQuery对象是包装DOM对象后产生的，但是jQuery无法使用DOM对象的任何方法，同理DOM对象也不能使用jQuery里的方法.乱使用会报错 //约定：如果获取的是 jQuery...//对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法。...jQuery.ajax(...)部分参数： url：请求地址 type：请求方式，GET、POST（1.9.0之后用method） headers：请求头 data：要发送的数据

2.9K4 0

Vanilla JS——最轻快的JavaScript框架

事实上,Vanilla JS的使用量已经远远超过了jQuery, Prototype JS, MooTools, YUI 和 Google Web Toolkit 的总和。...模块化 VanillaJS包括如下模块，下载安装时可以只选择需要的模块，以便提高性能。...s.display="none":setTimeout(fade,40)})(); jQuery ajax.googleapis.com/ajax/libs/jquery/...1/jquery.min.js">$('#thing').fadeOut(); AJAX请求 Vanilla JS var r = new XMLHttpRequest...ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">$.ajax({ type: 'POST', url:

7.1K4 0

02-老马jQuery教程-jQuery事件处理

],fn]) $("p").blur(); 当元素失去焦点时触发 blur 事件，这个函数会调用执行绑定到blur事件的所有函数，包括浏览器的默认行为。...focusin([data],fn) $("p").focusin(); 当元素获得焦点时，触发 focusin 事件。当元素获得焦点时，触发 focusin 事件。...使用 .bind() 时，选择器匹配的元素会附加一个事件处理函数，而以后再添加的元素则不会有。为此需要再使用一次 .bind() 才行。参数: type:一个或多个事件类型，由空格分隔多个事件。...on()方法绑定事件处理程序到当前选定的jQuery对象中的元素。on汇总了bind和live两种绑定事件的方式。可以支持一般的bind方法或者委托的方法。...on()方法绑定事件处理程序到当前选定的jQuery对象中的元素。on汇总了bind和live两种绑定事件的方式。可以支持一般的bind方法或者委托的方法。

7.5K0 0

JavaScript 事件委托以及jQuery对事件委托的支持

，动态添加元素的时候，不需要再手动地绑定处理函数了。...，只能在jQuery1.9以前的版本中使用。...从元素中删除先前用.live()绑定的所有事件.(此方法与live正好完全相反。)如果不带参数，则所有绑定的live事件都会被移除。...与live() 相对应，取消绑定，则用下列代码： $("p").die(); 在事件绑定上，jQuery 提供了一种更通用的函数： on(events,[selector],[data],fn)...data:当一个事件被触发时要传递event.data给事件处理函数。 fn:该事件被触发时执行的函数。 false 值也可以做一个函数的简写，返回false。

1.3K6 0

Python全栈之jQuery笔记

() 表单元素的值发生变化 click() 鼠标单击 dblclick() 鼠标双击当单击元素时,发生click事件....主动触发事件: 可使用jquery对象上的trigger方法来触发对象上绑定的事件....,当必须是它的内部元素span才能触发这个事件,支持动态绑定. on注册事件的语法: 第一个参数:events,绑定事件的名称可以是由空格分隔的多个事件(标准事件或自定义事件) 第二个参数:selector...$.ajax使用方法: 常用参数: 1、url 请求地址 2、type 请求方式,默认是'GET',常用的还有'POST' 3、dataType...前端性能优化分为如下几个方面: 一、代码部署: 1、代码的压缩与合并 2、图片、js、css等静态资源使用和主站不同域名地址存储,从而使得在传输资源时不会带上不必要的cookie信息.

6.6K4 0

4-Jquery学习四-事件操作

即使是执行live()函数之后新添加的元素，只要它匹配当前jQuery对象的选择器，绑定的事件处理函数仍然对其有效。要删除通过live()绑定的事件，请使用die()函数。...) $("selector").bind( "click" [, data ], handler ); // jQuery 1.3+ (1.4+支持参数data) $("selector").live(...使用该函数可以手动触发执行元素上绑定的事件处理函数，也会触发执行该元素的默认行为。...这里介绍的load()是一个事件函数，jQuery中还有一个同名的Ajax函数load()，用于通过Ajax加载html文档内容。...触发resize事件时，jQuery会按照绑定的先后顺序依次执行绑定的事件处理函数。要删除通过resize()绑定的事件，请使用unbind()函数。

5.4K9 0

一个小时学会jQuery

jQuery 1.3 （2009年1月）：这一版使用了全新的选择符引擎Sizzle，库的性能也因此有了极大提升。这一版正式支持事件委托特性。...jQuery1.7 （2011年11月04号）：新版本包含了很多新的特征，特别提升了事件委派时的性能尤其是在IE7下。...收集一组元素，可以使用如下简单的语法： $(selector) 或者 jQuery(selector) 也许刚开始你会觉得$()符号有点奇怪，但大部分jQuery用户很快就喜欢上它的简洁。..."); }); //AJAX 请求失败时显示信息。...发送请求时锁住浏览器。需要锁定用户交互操作时使用同步方式。

22.2K7 1

dom 自定义事件_pix4D生成dom

解决办法：（1）在每一个动态生成的地方都再绑定多一次事件，比如这个博客里面的例子（2）把bind改用live，因为live是实时监测的，对于新增的dom元素也是有效的（因为不断去绑定、判断，所以可能会影响...（4）在jquery1.7 起版本用on替代了bind()、live() 和 delegate() 方法。 3....5.关于bind：每次绑定事件之后事件会一直绑定着，除非用unbind解绑之后再重新绑定，要不然事件会一直存在，所以这就是为什么在做项目的时候，有时候ajax请求的结果会出现1,2,4,8这样叠加，是因为如果用了...bind，每次触发事件都会绑定一次操作，所以触发第一次的时候，ajax请求一次；第二次的时候，ajax请求1+1=2次；第三次就是1+2+1=4次；第四次就是1+2+4+1=8次，以此类推。...所以如果利用bind绑定事件的话，要先unbind解绑元素原本有的事件再绑定事件，才不会导致ajax请求多次。版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。

5473 0

jQuery 教程

$(selector).selector 在jQuery 1.7中已经不被赞成使用。...选取单选按钮点击元素在事件中经常使用术语”触发”（或”激发”）例如： “当您按下按键时触发 keypress 事件”。...; } ); focus() 当元素获得焦点时，发生 focus 事件。当通过鼠标点击选中元素或通过 tab 键定位到元素时，该元素就会获得焦点。...HTTP 请求：GET vs. POST 两种在客户端和服务器端进行请求-响应的常用方法是：GET 和 POST。...() 当Deferred（延迟）对象被受理时，调用添加的处理程序 deferred.fail() 当Deferred（延迟）对象被拒绝时，调用添加的处理程序 deferred.isRejected()

20.8K2 0

点击加载更多

事件绑定的几种常见方式

jQuery 升级踩坑大全

jQuery 快速入门教程

jQuery学习笔记

jQuery 重点解析 write less,but do more

jQuery中on()、bind()、live()、delegate()之间的区别

jQuery基础(五)一Ajax应用与常用插件-imooc

jQuery

jQuery on()方法

jQuery ajax - ajax()方法

前端架构师之01_JQuery

jquery学习

Vanilla JS——最轻快的JavaScript框架

02-老马jQuery教程-jQuery事件处理

JavaScript 事件委托以及jQuery对事件委托的支持

Python全栈之jQuery笔记

4-Jquery学习四-事件操作

一个小时学会jQuery

dom 自定义事件_pix4D生成dom

jQuery 教程

相关资讯

热门标签

活动推荐

运营活动

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐