解除绑定后，jQuery未将事件重新绑定到处理程序 - 腾讯云开发者社区

文章/答案/技术大牛

发布

关于jQuery用bind动态绑定事件无效的处理

最近在进行页面开发，在做页面特效的时候，需要给一个动态加载的按钮赋予一个事件于是不假思索的用$(obj).bind(); 来绑定事件。...但是这样存在一个问题： bind确实能绑定事件，但是那是相对于固定的html标签来说当页面内容属于动态加载的时候，bind事件就存在一个bug, 只能bind一次，当你第二次触发事件的时候就没用了...当我使用bind来绑定click事件，这时，第一次点击click能成功触发但是第二次点击，click事件无效了......后面研究发现，jQuery还有个绑定事件的方法：delegate(); 用法如下： $(".sentnum-box").delegate(".a-add-ordergoods","click",function...(){ //js数据代码 }); 这样就能实现对动态数据绑定事件，并永不失效

1.7K2 0

jQuery之事件绑定到触发全过程及知识点补充

( selector ), //命名空间，同一click事件有两个事件处理程序handler的话， //用这个标识，方便删除或添加handler...two触发') }) events是jQuery内部的事件队列 handle是真正绑定到element上的事件处理函数 body:{ events:{ click:[ 0:{...： $("#one").off("click.one") 七、jQuery.event.special 的处理机制绑定的事件，有些是不能统一处理的，比如load事件，是不支持冒泡的，所以即使开发者未用...trigger的机制去触发click事件，正是因为jQuery没有直接把事件相关的handler与元素直接绑定，而是采用了分离处理，所以我们通过trigger触发click事件与addEventListener...trigger方法了关于$().trigger()的源码解析请看：jQuery源码解析之trigger() ---- 最后，附上自己做的 jQuery事件绑定到触发全过程的流程图： ?

1.1K1 0

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

是的

没有找到

React篇(028)-如何在 JSX 回调中绑定方法或事件处理程序?

**Binding in Constructor:** 在 JavaScript 类中，方法默认不被绑定。这也适用于定义为类方法的 React 事件处理程序。通常我们在构造函数中绑定它们。...**Public class fields syntax:** 如果你不喜欢 bind 方案，则可以使用 *public class fields syntax* 正确绑定回调。...this.handleClick(event)}> {'Click me'} **注意：** 如果回调函数作为属性传给子组件，那么这些组件可能触发一个额外的重新渲染...在这些情况下，考虑到性能，最好使用 `.bind()` 或 *public class fields syntax* 方案。

2.6K1 0

硬核解析，巧用案例学习jQuery框架三种事件绑定方式

一个超会写bug的程序猿！...jquery如何进行事件的绑定！...一、 jquery标准的绑定方式 Jquery框架的标准绑定的语法是： jq对象.事件方法(回调函数)；如： Jquery对象.cilck();点击事件 Jquery对象.mouseover();鼠标移入时触发..."> 效果如下：二、on绑定事件/off解除绑定利用jquery的on()方法可以将的一个事件绑定到jquery对象上，语法格式如下： jq对象.on("事件名称...当单击jq对象对应的组件后，会执行fn1.第二次点击会执行fn2…依次执行下去，当执行完之后会重新从第一个事件开始执行。

2.8K1 0

由重构进阶前端开发入门 (三) 事件冒泡与事件代理

这两种情况下，你会把点击事件的监听器绑定到哪些元素上呢？把页面所有按键、甚至所有页面元素都绑定一遍？...且不说绑定如此多元素的监听器的效率，一旦页面里的元素有变动、或者状态变更后需要解除绑定，都得做各种额外零散的补救操作。这样的代码可以说没法应对业务的任何变更，几乎能逼死之后的维护人员。...因此点击事件会从事件发生的最底层元素开始，自动一层层往上走，不出意外，会一直触发到页面的最外层。所以，我们只需要在 body 元素上绑定点击事件监听函数，处理完毕后清理掉即可。...绑定点击后关闭的事件处理函数 $('body').on('click', hideToast); function hideToast() { // 3....解除绑定的函数 $('body').off('click', hideToast); } } 在第二篇《事件与事件对象》中，我们提到过通常名为 e 的事件对象参数。

3431 0

jquery事件绑定

.bind() 　　为一个元素绑定一个元素处理程序。　　...$("p").die("click") 　　　　　　解除所有段落上通过live事件绑定的click 事件。 .off() 　　移除一个事件处理函数。　　...selector 　　　　　　一个选择器，当绑定事件处理程序的匹配最初传递给。　　....trigger() 　　根据绑定到匹配元素的给定的事件类型执行所有的处理程序和行为。　　...events 　　　　　　一个或多个事件类型和以前绑定的函数组成的一个对象，用来以解除他们（处理程序）。

4.8K7 0

jQuery 事件注册和事件处理

语法语法: element.事件(function(){}) $ ("div"). click (function(){事件处理程序 } 其他事件和原生基本-致。...事件处理因为普通注册事件方法的不足，jQuery又开发了多个处理方法，重点讲解如下： on(): 用于事件绑定，目前最好用的事件绑定方法 off(): 事件解绑 trigger().../ triggerHandler(): 事件触发 2.1 事件处理 on() 绑定事件因为普通注册事件方法的不足，jQuery又创建了多个新的事件绑定方法bind() / live() / delegate...可以绑定多个事件，多个处理事件处理程序。...( ) 方法可以移除通过on0方法添加的事件处理程序。

4.9K4 0

jq---方法总结

3.文档加载完毕后执行的处理函数？...，第一次触发后就自动解除绑定 $dblclick() //双击事件 focus()、聚焦的时候事件 change()、输入域改变的时候 hover()、移入的时候 submit()(仅限于表单元素...foo命名空间下的mouseout事件的处理函数 $("selector").trigger("mouseout.foo"); ：移除事件 //主要用于解除通过click()、dblclick()等直接事件方法以及...bind()、one()等方法绑定的处理函数 $("selector").unbind("click"); //主要用于解除通过live()方法绑定的处理函数 $("selector").die("click..."); //主要用于解除通过delegate()方法绑定的处理函数 $(document).undelegate("selector", "click"); //主要用于解除通过on()方法绑定的处理函数

3.9K2 0

jQuery 事件注册、事件处理

语法 element.事件(function(){}) $(“div”).click(function(){ 事件处理程序 }) 其他事件和原生基本一致。...事件处理因为普通注册事件方法的不足，jQuery又开发了多个处理方法，重点讲解如下： on(): 用于事件绑定，目前最好用的事件绑定方法 off(): 事件解绑 trigger().../ triggerHandler(): 事件触发 2.1 事件处理 on() 绑定事件因为普通注册事件方法的不足，jQuery又创建了多个新的事件绑定方法bind() / live() /...3. fn:回调函数即绑定在元素身上的侦听函数。 on() 方法优势1：可以绑定多个事件，多个处理事件处理程序。...() 方法可以移除通过 on() 方法添加的事件处理程序。

5K2 0

「jQuery」基础 - 03

事件处理因为普通注册事件方法的不足，jQuery又开发了多个处理方法，重点讲解如下： on()：用于事件绑定，目前最好用的事件绑定方法 off()：事件解绑 trigger() 、triggerHandler...()：事件触发 1.2.1 事件处理 on() 绑定事件因为普通注册事件方法的不足，jQuery又创建了多个新的事件绑定方法bind()、live()、delegate()/on()等，其中最好用的是...事件解绑 off // $("div").off(); // 这个是解除了div身上的所有事件 $("div").off("click"); // 这个是解除了...，然后存储给本地存储重新渲染加载数据列表因为a是动态创建的，我们使用on方法绑定事件 1.7.6 案例：toDoList 正在进行和已完成选项操作当我们点击了小的复选框，修改本地存储数据，再重新渲染数据列表...之后保存数据到本地存储重新渲染加载数据列表 load 加载函数里面，新增一个条件,如果当前数据的done为true 就是已经完成的，就把列表渲染加载到 ul 里面如果当前数据的done 为false

4.1K3 0

前端成神之路-03_jQuery

03 - jQuery 学习目标：能够说出4种常见的注册事件能够说出 on 绑定事件的优势能够说出 jQuery 事件委派的优点以及方式能够说出绑定事件与解绑事件能够说出 jQuery...事件处理因为普通注册事件方法的不足，jQuery又开发了多个处理方法，重点讲解如下： on(): 用于事件绑定，目前最好用的事件绑定方法 off(): 事件解绑 trigger() / triggerHandler...(): 事件触发 1.2.1 事件处理 on() 绑定事件因为普通注册事件方法的不足，jQuery又创建了多个新的事件绑定方法bind() / live() / delegate() / on()...1个或者多个事件处理程序 // $("div").on({ // mouseenter: function() { //...(i, 1)方法 // 5.存储修改后的数据，然后存储给本地存储 // 6.重新渲染加载数据列表 // 7.因为a是动态创建的，我们使用on方法绑定事件 1.7.6 案例：toDoList 正在进行和已完成选项操作

3.8K2 0

移动端滚动加载-----jQuery 和原生JS

（防止进行多次ajax请求） $(window).unbind('scroll',isScrollBottom); 4.返回数据，渲染到页面并再次绑定监听事件 $(window).bind('scroll...(){ if($('body').height() - $('body').scrollTop() - $(window).height() < 10){ //解除滚动监听绑定事件...; } } //重新启动滚动监听事件，放入ajax成功函数的最后执行 //如果再次绑定未在ajax中执行，则可以在ajax过后进行延迟绑定...window.removeEventListener('scroll',isScrollB0ttom ,false); //ajax数据请求 //数据渲染后再次绑定监听事件window.addEventListener...('scroll',isScrollB0ttom ,false); 　　} }; 注意： 1.每次满足滑动到底部进入判断先解除监听事件； 2.每次加载数据渲染完后，必须再次绑定监听事件； 3.判断触发条件使用一个小的范围

24K1 0

jQuery 事件注册与事件处理

事件处理因为普通注册事件方法的不足，jQuery又创建了多个新的事件绑定方法bind() / live() / delegate() / on()等，其中最好用的是: on()，重点讲解如下：...on(): 用于事件绑定，目前最好用的事件绑定方法 off(): 事件解绑 trigger() / triggerHandler(): 事件触发 2.1 事件处理 on() 绑定事件 on...()方法在匹配元素上绑定一个或多个事件的事件处理函数语法: element.on (events, [selector], fn) events:一个或多个用空格分隔的事件类型,如"click或"...1个或者多个事件处理程序 // $("div").on({ // mouseenter: function() { // ...事件解绑 off // $("div").off(); // 这个是解除了div身上的所有事件 $("div").off("click"); // 这个是解除了

2.3K4 1

jQuery 事件绑定和 JavaScript 原生事件绑定

总结一下：jQuery 事件绑定和 JavaScript 原生事件绑定及区别 jQuery 事件绑定 jQuery 中提供了四种事件监听绑定方式，分别是 bind、live、delegate、on...live、delegate 不多用，在Jquery1.7中已经移除，这里不多说重点介绍 bind、on bind(event,[data],function) bind 是使用频率较高的一种，作用就是在选择到的元素上绑定特定事件类型的监听函数...该方法给 API 带来很多便利，我们推荐使用该方法，它简化了 jQuery 代码库。注意：使用 on() 方法添加的事件处理程序适用于当前及未来的元素（比如由脚本创建的新元素）。...可以发现：使用 jQuery 的事件绑定方法，对同一个元素的 click 事件先后绑定了三个处理函数，结果按顺序都输出了，说明了 jQuery 的事件处理函数是叠加的；而使用 JavaScript...原生的事件绑定，可以发现只执行了最后一个相同的绑定事件，后面绑定的事件处理函数覆盖了前面的事件处理函数。

7K2 0

JavaWeb——JQuery之高级操作应用及实践案例总结（动画、遍历、事件绑定）

事件绑定 JQuery事件绑定方式包括： 1）JQuery标准的绑定方式：JQuery对象.事件方法（回调函数）；注意：如果调用事件方法，不传递回调参数，会触发浏览器默认行为； 2）on绑定事件、off...解除绑定：JQuery对象.on("事件名称"，回调函数)、JQuery对象.off("事件名称")；注意：若off方法不传递任何参数，则会将组件上所有的事件解除； 3）事件切换toggle：JQuery...注意：JQuery1.9后该功能删除了，要使用的话引入jquery-migrate-1.0.0.js插件。【练习案例1】：JQuery标准的绑定方式【练习案例2】：on绑定事件、off解除绑定解除btn按钮的单击事件 $("#btn2").click(function () { //解除btn按钮的单击事件

10.5K2 0

一文深入JQuery

3.0 版本之后提供的方式事件绑定 jquery标准的绑定方式 on绑定事件/off解除绑定事件切换：toggle 案例广告显示和隐藏抽奖插件：增强JQuery的功能实现方式：动画...for(元素对象 of 容器对象) 事件绑定 jquery标准的绑定方式 jq对象.事件方法(回调函数)；注：如果调用事件方法，不传递回调函数，则会触发浏览器默认行为。...表单对象.submit();//让表单提交 on绑定事件/off解除绑定 jq对象.on(“事件名称”,回调函数) jq对象.off(“事件名称”) 如果off方法不传递任何参数，则将组件上的所有事件全部解绑...事件切换：toggle jq对象.toggle(fn1,fn2…) 当单击jq对象对应的组件后，会执行fn1.第二次点击会执行fn2… 注意：1.9版本 .toggle() 方法删除,jQuery...给结束按钮绑定单击事件 $("#stopID").click(function () { //处理按钮是否可以使用的效果 $("#startID").prop("disabled"

4.8K3 0

4-Jquery学习四-事件操作

unbind()函数主要用于解除由bind()函数绑定的事件处理函数。...从jQuery 1.7开始，on()函数提供了绑定事件处理程序所需的所有功能，用于统一取代以前的bind()、 delegate()、 live()等事件函数。...p元素(Element) alert( $(this).text() ); }); 如果要绑定所有的元素，你可以编写如下jQuery代码： //为所有p元素绑定click事件处理程序(注意...同样以初始HTML代码为例，我们可以编写如下jQuery代码： // 为div中的所有p元素绑定click事件处理程序 // 只有n2、n3可以触发该事件 $("div").on("click", "p...off()函数主要用于解除由on()函数绑定的事件处理函数。 10,one one()函数用于为每个匹配元素的一个或多个事件绑定一次性事件处理函数。

5.4K9 0

jQuery

/jquery/jquery.min.js"> /* jQuery 的事件绑定 1. on() + 事件绑定, 根据传递不同的参数做不同的事情...() + 用来解除事件绑定的 + 语法: 1....元素集合.off(事件类型) => 解除元素身上该事件类型的所有事件处理函数 2....元素集合.off(事件类型, 事件处理函数) => 解除元素身上该事件类型的某一个事件处理函数 4. trigger() + 用 JS 代码的方式来触发事件...) // 把 click 事件的所有事件处理函数全部解除 // $('li').off('click') // 3-2. off(事件类型, 事件处理函数) // 把 click

2.1K1 0

前端开发JS——jQuery常用方法

，或者如果该事件存在多个处理函数，这可能造成浏览器的严重的性能问题 4、jQuery鼠标事件之mouseover与mouseout事件 mouseover方法用于监听用户鼠标移入操作，只有鼠标移入区域内后才生效...但是他们最主要的区别是第四点可能会处理冒泡事件，这第五点是不会处理冒泡事件 6、jQuery鼠标事件之hover事件这个事件是第五点的总结方法，所以他也不会处理冒泡事件，即悬停事件，在元素区域内悬停（...e.preventDefault()来处理；也可以在函数上返回false 12、jQuery键盘事件之keydown与keyup事件 keydown方法用于监听用户键盘按下操作，只有键盘按下后才生效，keyup...如果提供了第二参数，那么事件在往上冒泡的过程中遇到了选择器匹配的元素，将会触发事件回调函数就是说向上冒泡匹配到的元素，由该元素执行回调函数的范围 16、卸载事件off()方法通过on()绑定的事件处理程序...$ele.off("mouseover") 解除所有事件 $ele.off() 17、jQuery事件对象的作用可以借用对象的target属性与冒泡机制实现事件委托-------多个事件绑定同一个函数

6.3K2 0

JavaScript 学习-40.jQuery 绑定事件 on 和 bind

前言 jquery 有四种绑定事件的方式:on, bind, delegate,live。其中 live() 方法已被移除。...$(selector).off(type)为元素解除绑定的事件 on 绑定事件基本语法 $(selector).on(event,childSelector,data,function) 参数描述...事件的类型一个或多个，由空格分隔多个事件值。 childSelector 可选。规定只能添加到指定的子元素上的事件处理程序（且不是选择器本身，比如已废弃的 delegate() 方法）。...console.log('btn 点击 ...') }) }) off() 方法 off() 方法通常用于移除通过 on() 方法添加的事件处理程序。...规定添加到元素的一个或多个事件。由空格分隔多个事件值。必须是有效的事件。 data 可选。规定传递到函数的额外数据。 function 必需。规定当事件发生时运行的函数。

1.4K2 0

点击加载更多

关于jQuery用bind动态绑定事件无效的处理

jQuery之事件绑定到触发全过程及知识点补充

React篇(028)-如何在 JSX 回调中绑定方法或事件处理程序?

硬核解析，巧用案例学习jQuery框架三种事件绑定方式

由重构进阶前端开发入门 (三) 事件冒泡与事件代理

jquery事件绑定

jQuery 事件注册和事件处理

jq---方法总结

jQuery 事件注册、事件处理

「jQuery」基础 - 03

前端成神之路-03_jQuery

移动端滚动加载-----jQuery 和原生JS

jQuery 事件注册与事件处理

jQuery 事件绑定和 JavaScript 原生事件绑定

JavaWeb——JQuery之高级操作应用及实践案例总结（动画、遍历、事件绑定）

一文深入JQuery

4-Jquery学习四-事件操作

jQuery

前端开发JS——jQuery常用方法

JavaScript 学习-40.jQuery 绑定事件 on 和 bind

相关资讯

热门标签

活动推荐

运营活动

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐