绑定到动态创建的元素的事件.(jQuery 1.7.2) - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

jquery获取元素绑定的事件

一个简单的记录，在调试jquery的事件绑定时会用到。查看某元素是否绑定上了事件。...在JQuery1.8之前： obj=$('div.event');obj.data('events'); 在JQuery1.8中： objs=$('div.event');$...._data(objs[0],'events'); 参考： http://stackoverflow.com/questions/12214654/jquery-1-8-find-event-handlers

5.7K2 0

jQuery 查找on事件绑定元素的被绑定元素方法

jQuery 查找on事件绑定元素的被绑定元素方法遇到的问题今天写了一个JQ插件,结果里面有一点问题.让我很郁闷.问题演示代码如下 $box.on('click', 'img', function(...){ $(this) }); 如上代码,当我点击这个图片的时候 $(this) 是指 img ....当然这是正确的. 而我需要找到 $box 也就是 img 的父级. 如果不是插件的话,我当然可以根据它的ID或者CLASS来进行查询.问题是,我是写的插件,也就是说,我并不知道它的这些信息是什么....解决方法很多基础的东西不理解,就会出现我这样的问题.如同事所说,你是还不会爬呢,都学上跑了.因此,踩坑无数啊....解决方法如下: $box.on('click', 'img', function(){ $box.has($(this)) }); 如上,通过 .has 操作,就能找到唯一的父级被绑定元素了.

5.5K1 0

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

是的

没有找到

动态添加的html元素绑定事件的方法

避免先写了DOM操作，但是元素是动态加载的，所以点击不生效，比较好的方法有两个： 1、动态添加的时候加行内事件，比如onclick="funcName()" 在js中写好方法名对应的方法就可以了，如果绑定方法的元素太多...，可以考虑使用方法二； 2、jquery的on事件绑定 eg: on事件可以给动态添加的元素也绑定事件。...console.log("aaa") let num = $(this).parents(".input-group").index(); console.log(num) }) 注意：on事件先是获取到父元素...，然后绑定到子元素上，父元素最好是已经存在的元素，而不是动态添加的。

4.5K4 0

使用jQuery.data()查看元素上绑定的事件

最近遇到一个诡异的问题，发现我添加在一个HTMLElement片段上面的事件绑定，会在后续的流程中，无故丢失了。但是，我不知道它是什么时候丢失的。所以我需要要一步步逼近定位到问题。...最先想到的是浏览器面板上面的，可以选中元素，看元素上面的事件绑定。但浏览器上面看到的是结果量，也就是看到的是已经丢失了事件的元素，但我还是不知道什么时候丢失的。...我可以断点取到每个阶段的HTMLElement元素的状态，但是，这个时候，我却找不到观察其事件绑定情况的方法。谷歌好久，发现JS原生是没法查看事件绑定情况的。...还好，我们都是用的jQuery，用的$.on()。而jQuery自身事件绑定，额外添加了一层事件数组。...，就会返回这个元素上面绑定的所有事件。

2.8K0 0

JQ动态生成的元素，原事件绑定失效

Code： $('code').click(function () { console.log($(this).text()); }); New Code：（.container 是所在的div...'.container').on("click", "code", function () { 　　console.log($(this).text()); }); 之前只是知道官方推荐使用on来生成事件...，并不知道其好处，这次知道了话说，，，真的好久没碰前端了，忘差不多了，O(∩_∩)O~ 动态加载JS 和 CSS 在线浏览PDF之PDF.JS （附demo）几个比较有意思的JS脚本经典JS

1.6K2 0

cssjshtml jquery向动态生成的元素添加事件

定义和用法 delegate() 方法为指定的元素（属于被选元素的子元素）添加一个或多个事件处理程序，并规定当这些事件发生时运行的函数。...使用 delegate() 方法的事件处理程序适用于当前或未来的元素（比如由脚本创建的新元素）。...规定要附加事件处理程序的一个或多个子元素。 event 必需。规定附加到元素的一个或多个事件。由空格分隔多个事件值。必须是有效的事件。 data 可选。规定传递到函数的额外数据。...规定当事件发生时运行的函数。 jquery-1.10.2.js"> Click me!

4.7K1 0

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

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

1.7K2 0

jquery绑定事件的坑，重复绑定问题

我实现点击table表格中的删除按钮，找到当前按钮的祖先元素tr 然后删除该行，但是我首先点击删除的时候要先弹出提示框，是否要下载，这时在点击删除按钮删除，之前没有考虑到事件重复绑定问题，所以每次点击删除的时候就会多选择几行...，之后选择的越来越多，经过网友解答，成功解决，先把重复绑定的删除的click事件解绑再继续绑定，就没问题。

3.1K1 0

关于一些动态创建的节点无法绑定事件的问题

在我们HTML页面中有时候一些DOM元素节点（例如：一些页面加载的新闻公告列表[如下图]）是需要通过AJAX请求接口数据动态创建的，而当我们想在JS中想为这些节点绑定事件（如：click,hover...new_list.png 解决办法：使用JQ提供的.on()和.delegate()方法可以解决解决此问题，给动态加载的元素成功绑定上事件，但是在这两种方法的参数中一定得写上我们需要绑定事件的那个元素选择器...这两种方法内的参数 .list 就是我们动态加载出来需要绑定事件的那个元素，前面的 #parent 是 .list 元素的父元素。...//javascript 代码 //.list为新闻里的每一条公告，是我们动态创建的;#parent是一个包裹着里的这一行行公告的一个div。...//一般来说，我们绑定事件的写法都是用下面的第一和第二种写法。但是这种写法是绑定不上的。

1.4K1 0

jQuery源码解析之click()的事件绑定

一、事件委托 DOM有个事件流特性，所以触发DOM节点的时候，会经历3个阶段：（1）阶段一：Capturing 事件捕获（从祖到目标）在事件自上（document->html->body->xxx）...二、$().click() 作用：为目标元素绑定点击事件源码： //这种写法还第一次见，将所有鼠标事件写成字符串再换成数组 //再一一绑定到DOM节点上去 //源码10969行 jQuery.each...() 作用：在被选元素及子元素上添加一个或多个事件处理程序源码： //绑定事件的方法 //源码5812行 jQuery.fn.extend( { //在被选元素及子元素上添加一个或多个事件处理程序...jQuery.on() 方法： //绑定事件的on方法 //源码5143行 //目标元素，类型（click,mouseenter,focusin,xxx）,回调函数function(){xxx...:\.(.+)|)/; 综上，绑定事件的本质即调用element.addEventListener()方法，但 jQuery 有太多的情况需要考虑了。（完）

2.4K2 0

jquery中动态新增的元素节点无法触发事件解决办法

在使用jquery中动态新增的元素节点时会发现添加的事件是无法触发的，我们下面就为各位来详细的介绍此问题的解决办法．　　...其实最简单的方法就是直接在标签中写onclick=""，但是这样写其实是有点low的，最好的方式还是通过给类名绑定一个click事件。...解决jquery中动态新增的元素节点无法触发事件的问题有两种解决方法，如下：方法一：使用live 　　live()函数会给被选的元素绑定上一个或者多个事件处理程序，并且规定当这些事件发生时运行的函数。...通过live()函数适用于匹配选择器的当前及未来的元素。比如，通过脚本动态创建的元素。...实现如下： $('.liLabel').live('click', function(){ alert('OK'); }); 方法二：使用on 　　可以通过on方法绑定事件，可以绑定到它的父级或者

2.7K2 0

jQuery 事件(三) 事件的绑定和解绑、对象的使用、自定义事件

事件的绑定和解绑 on()的多事件绑定之前学的鼠标事件，表单事件与键盘事件都有个特点，就是直接给元素绑定一个处理函数，所有这类事件都是属于快捷处理。...jQuery on()方法是官方推荐的绑定事件的一个方法基本用法：.on( events ,[ selector ] ,[ data ] ) 最常见的给元素绑定一个点击事件，对比一下快捷方式与on...由于浏览器事件冒泡特性，可以在触发li时把这个事件往上冒泡到ul上，因为ul上绑定事件响应，所以能触发这个动作。事件对象怎么才知道触发的li元素是哪个一个？...正常来说是不可以的，但是jQuery解决了这个问题，提供了一个trigger方法来触发浏览器事件 $('#elem').trigger('click'); //在绑定on的事件元素上，通过trigger...方法就可以调用到alert .trigger定义根据绑定到匹配元素的给定的事件类型执行所有的处理程序和行为 trigger除了能够触发浏览器事件，同时还支持自定义事件，并且自定义时间还支持传递参数 $

4.9K3 0

jquery 用于操作动态元素的delegateon方法

delegate() 方法的事件处理程序适用于当前或未来的元素（比如由脚本创建的新元素）。...在做项目中有很多由ajax动态生成的html标签，jquery对这些标签不会响应(selector).click(function.....查看资料有的推荐使用live方法，但live在jQuery1.7中就不再建议使用，在1.9中就给删除了，改用on方法取代live方法。...jQuery官方网站声称下面三行代码是等价的 (“.btn”).live(“click”, function(){ alert(“Goodbye!”)...; }); // jQuery 1.4.3+ 这里要特别注意：$(“.jk_table”)这个对应的元素必须不是动态生成的。版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。

3.5K2 0

WEB入门之十四 jQuery事件

，下面的内容就会隐藏起来，依次循环 5.4 jQuery事件绑定 jQuery提供了诸多函数来处理复杂的事件，例如动态绑定事件，或者一个元素同时绑定多个事件处理函数，或者多个元素同时共用一个事件处理函数等...表5-1-7 jQuery常用绑定函数函数名说明 bind 为某元素动态绑定事件及处理函数 unbind 移除某元素的事件，与bind相反 live 相当于增强的bind函数，详见下面介绍...假设给所有的文本框通过bind绑定了鼠标单击事件，然后再动态创建一个文本框，此时绑定的鼠标单击事件对这个新创建的文本框无效；但是如果使用live进行绑定，那么新创建的文本框也会绑定鼠标单击事件。...这说明对于动态创建的元素，bind是无能为力的。但是如果把示例5.17中的bind换成live，这个问题就解决了。...把bind换成live后，表格中的任何一行在单击时都可以改变背景色，包括动态创建的行。

1.9K1 0

关于动态创建DOM元素的问题

testDiv").innerHTML ="动态创建的div"; 而且用的应该是还是乐此不疲，但是有多少人知道这是错误的做法!...但是如果我们使用Dom的CreateElement创建对象, 在所有的浏览器中几乎都可以. 但是在jQuery中如果传入的而是一个完整的HTML字符串, 内部也是使用innerHTML....第二种方式：使用Jquery 当HTML字符串是没有属性的元素是, 内部使用document.createElement创建元素, 比如: //jQuery内部使用document.createElement...创建元素: $(" ").css("border","solid 1px #FF0000").html("动态创建的div").appendTo(testDiv); 否则使用innerHTML方法创建元素...: //jQuery内部使用innerHTML创建元素: $(" 动态创建的div ").appendTo(testDiv) （引自：http://kb.cnblogs.com/page/46453

3.1K2 0

代码中执行绑定元素的指定事件trigger方法

前面业务里有个搜索功能 , 入口比较深 , 现在想要把入口挪到有公共header的地方 , 在不想完全实现一遍功能的情况下 , 就需要模拟进行多个点击事件来执行点击后的效果 ?...执行先点击1 ,再给inout赋值 ,再点击2 基本思路是类似jquery的trigger方法 , 原生js也是可以实现 , 代码如下按钮1 按钮2 // 假如想通过点击 Button-1 触发 Button-2 的某个事件 let btn_1 = document.getElementById.../1.10.2/jquery.min.js"> 按钮3 按钮4 //jquery的trigger方法 $( "#btn-3" ).click(function() { alert("按钮3"); $( "#btn-4" ).trigger( "click

1.3K2 0

WEB入门之十四 jQuery事件

，依次循环 5.4 jQuery事件绑定 jQuery提供了诸多函数来处理复杂的事件，例如动态绑定事件，或者一个元素同时绑定多个事件处理函数，或者多个元素同时共用一个事件处理函数等。...表5-1-7 jQuery常用绑定函数函数名说明 bind 为某元素动态绑定事件及处理函数 unbind 移除某元素的事件，与bind相反 live 相当于增强的bind函数，详见下面介绍 die...假设给所有的文本框通过bind绑定了鼠标单击事件，然后再动态创建一个文本框，此时绑定的鼠标单击事件对这个新创建的文本框无效；但是如果使用live进行绑定，那么新创建的文本框也会绑定鼠标单击事件。...这说明对于动态创建的元素，bind是无能为力的。但是如果把示例5.17中的bind换成live，这个问题就解决了。...把bind换成live后，表格中的任何一行在单击时都可以改变背景色，包括动态创建的行。

1.8K1 0

js 动态生成 input 的绑定事件 blur 无效

https://blog.csdn.net/u011415782/article/details/89230040 ☯ 背景描述今天在进行代码编写时，我需要根据ajax返回的数据动态生成一个表格...，而针对于其中的input标签，要求设置失去焦点的blur事件需要实现的界面截图如下： ?...，而动态新生成的却无法触发blur事件因为测试失败后，转而考虑新的写法，且可以正常实现 ?...ி 附录 1.针对我的问题，求助度娘，发现了下面的一个帖子，可作参考动态添加的blur事件失效 [问题点数：60分，结帖人lawrendc] 时间相当久远... 2.最接近解决需求的文章如下...，建议可自行测试动态生成input绑定事件无效如：blur 意见：异步导致绑定事件失败，需使用全局绑定事件 3.w3school 文档 - onblur 事件这就是官方文档

10.8K0 0

jquery获取元素到页面顶部的距离

这时就会用到获取需要固定在页面位置的元素距离页面顶部的距离，通过比较文档滚动条到顶部的距离和页面元素到顶部距离的大小便可确定。...在jquery中有一个语句可以获取到元素到顶部的距离，语法为 $(selector).offset().top 下面看一个例子 luofanting.com.cn 那么 $("#footer_luofanting_com_cn").offset().top 就是元素到页面顶部的距离

6.4K2 0

JavaScript 技术篇-通过代码获取dom元素绑定的监听事件，chrome浏览器查看js元素绑定的监听事件

Array(1)} mousedown: [{…}] mouseout: [{…}] __proto__: Object getEventListeners() 方法可以获取到 dom 元素的监听...可以看到当前 dom 节点的监听就是 mousedown 和 mouseout。取消勾选 Ancestors All 可以排除当前元素所有祖先元素的监听。...反过来如果想通过代码获取某个元素所有祖先元素的监听可以遍历它的所有上级节点再依次获取所有 dom 节点的监听。

7.9K5 0

点击加载更多

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭