`
Copperfield
  • 浏览: 261025 次
  • 性别: Icon_minigender_1
  • 来自: 上海
博客专栏
C407adc3-512e-3a03-a056-ce4607c3a3c0
java并发编程陷阱
浏览量:25213
社区版块
存档分类

Jquery对动态生成的元素绑定事件

 
阅读更多

 

查询 Jquery api中的 .live()事件;

很多时候我们对一个对象绑定一个事件的时候老是发现绑定不成功,这时你可以查查看这个对像是不是你通过Jquery动态生成的。

jQuery的html()可以给现在元素附加新的元素,innerHTML也可以,那么,如何给这些新生成的元素绑定事件呢?直接在元素还未生成前就绑定肯定是无效的,因为所绑定的元素目前根本不存在。

然而,jQuery为我们提供了一个函数来解决这个问题,它就是.live(),它可以给所有元素绑定事件,不论是已有的,还是将来生成的,比如:

$(‘#div’).live(‘click’,function(){

//do stuff

});

它还可以同时绑定多个事件:

$('.hoverme').live('mouseover mouseout', function(event) {
  if (event.type == 'mouseover') {
    // do something on mouseover
  } else {
    // do something on mouseout
  }
});
注意:
目前支持 click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, keydown, keypress, keyup。 
还不支持 blur, focus, mouseenter, mouseleave, change, submit 

这个非常重要。
分享到:
评论

相关推荐

    jQuery为动态生成的select元素添加事件的方法

    7. 绑定事件到动态元素:文章最后部分展示了如何为动态生成的select元素绑定事件处理器。通过`$.on()`方法,即使元素是后来添加到页面中的,我们依然可以捕捉到它们的事件。在这个例子中,为ID以`"sl_0"`开头的...

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

    本文实例讲述了jQuery给动态添加的元素绑定事件的方法。分享给大家供大家参考。具体分析如下: jquery中绑定事件一般使用bind,或者click,但是这只能是对已经加载好的元素定义事件,那些后来添加插入的元素则需要...

    jQuery动态生成的元素绑定事件操作实例分析

    本文实例讲述了jQuery动态生成的元素绑定事件操作。分享给大家供大家参考,具体如下: 这段时间在写代码的时候遇到一个问题,通过append()添加的节点,点击事件不起作用。当时我百思不得其解,各种找错都没找到错误...

    layui动态绑定事件的方法

    在前端开发中,动态绑定事件是一项非常重要的技术,尤其是在处理动态创建的DOM元素时。本文将介绍使用layui框架来实现动态绑定事件的方法,并探讨其中的关键技术点。 首先,我们需要了解动态创建DOM元素后,原有的...

    jquery html动态添加的元素绑定事件详解

    在实际开发中会遇到要给动态生成的html元素绑定触发事件的情况: <ul></ul> 假设我们要给ul动态添加的绑定click事件形成如下结果 <li name=apple>apple <li name=pear>pear [removed] function test...

    JQuery实例动态生成树

    在网页开发中,jQuery是一个非常流行的JavaScript库...总之,jQuery动态生成树形结构涉及HTML结构、JSON数据处理、事件绑定以及可能的异步加载。通过熟练掌握这些技能,开发者可以创建出功能丰富、交互性强的树状界面。

    浅谈Jquery为元素绑定事件

    关于Jquery为元素绑定事件的知识点,我们需要从几个方面...以上所述知识点,希望对于使用Jquery进行前端开发的人员有所帮助,能够让大家对Jquery元素绑定事件有更深入的理解,并在实际开发中正确、高效地使用相关方法。

    JQuery 动态生成DIV、Table并处理数据

    标题 "JQuery 动态生成DIV、Table并处理数据" 涉及的是使用JavaScript库JQuery来动态创建HTML元素,特别是DIV和Table,并且处理其中的数据。这在Web开发中非常常见,尤其是在构建交互式用户界面时。下面将详细阐述这...

    关于动态生成dom绑定事件失效的原因及解决方法

    之前做项目都是直接用jquery的bind绑定事件,不过当时都不是动态生成dom元素,而是已经页面中原本存在的dom元素进行事件绑定,最近在测试给动态生成的dom绑定事件的时候发现事件失效,于是就测试了一下: ...

    jquery 给动态生成的标签绑定事件的几种方法总结

    在jQuery中,为动态生成的元素绑定事件是一个常见的需求,特别是在构建交互丰富的Web应用时。由于JavaScript运行时只会处理已存在DOM中的元素,因此对于之后动态添加的元素,普通的事件绑定方式可能无法生效。以下是...

    JQuery绑定事件

    **jQuery绑定事件**是JavaScript库jQuery中的核心功能之一,它极大地简化了DOM元素事件处理的流程,使得开发者能够更加高效地编写代码。在JavaScript原生语法中,为元素添加事件监听器通常涉及到`addEventListener`...

    vue动态生成dom并且自动绑定事件

    用jquery的时候你会发现,页面渲染后动态生成的dom,在生成之前的代码是没办法取到相应对象的,必须重新获取.但是vue基于数据绑定的特性让它能生成的时候直接绑定数据。 html: <input type=text v-model...

    jquery动态生成树菜单

    总结,动态生成jQuery树菜单涉及HTML结构的构建、jQuery的选择器和DOM操作、数据绑定以及事件处理。这个过程需要对HTML、CSS和JavaScript有深入的理解,而jQuery则提供了便利的工具,使得这些任务变得更为简单。不过...

    AngularJS实现给动态生成的元素绑定事件的方法

    本文实例讲述了AngularJS实现给动态生成的元素绑定事件的方法。分享给大家供大家参考,具体如下: 1 . 我们知道在jQuery中,动态生成一个元素,如果要在动态生成元素的同时,动态绑定事件,可以通过live/on方法(在...

    jquery1.10给新增元素绑定事件的方法

    首先,.live()方法在旧版本的jQuery中被广泛使用,用于为动态添加到DOM中的元素绑定事件。然而,随着jQuery的发展,.live()方法被发现存在一些性能和作用域的问题,因此在jQuery 1.10版本中被废弃。为了替代.live()...

    JQuery调用绑定click事件的3种写法

    `.on()`方法可以处理当前及未来的元素(动态生成的元素)的事件,这使得它在处理动态内容时非常有用。下面是使用`.on()`的方法: ```javascript $('#clickmeon').on('click', function(){ alert("Hello World on")...

    jQuery on()方法绑定动态元素的点击事件实例代码浅析

    3. 在jQuery中,直接为动态生成的元素绑定事件时可能会遇到问题,因为这些元素在初始绑定事件时还不存在于DOM中。为了解决这个问题,on()方法使用了事件委托机制,即将事件处理器绑定到一个静态父元素上,然后指定要...

Global site tag (gtag.js) - Google Analytics