jquery生成元素注册事件无效,及事件委托的使用

  在页面加载完成之后,我们在页面操作用js生成html代码到页面,动态的添加元素带页面上

但是,这里可能很多人就必须碰到的一个问题就出现了,当你之后动态添加了元素到页面上,发现这个元素的绑定事件无效,如click点击了根本没有作用

这里就要用到事件委托让未来元素能绑定事件

方法一

$("div").delegate("#id", "click", function(){   ...............});

这样做就能保证你未来生成的元素也能绑定单击事件

方法二

on好像也能满足这个方法,只不过还要设定on()方法的selector参数才行:

$(‘div‘).on(‘cllick‘, ‘#id‘, function(){
    ..............
});
时间: 2024-09-29 06:46:28

jquery生成元素注册事件无效,及事件委托的使用的相关文章

jQuery 判断元素上是否绑定了事件

我研究了一下之后发现,jQuery都将事件缓存起来了,其实也是为了防止内存溢出以及页面unload的时候的速度,也包括多函数触发,方便管理等诸多好处,具体可以参考此文. jQuery会在window.unload的时候卸载所有绑定过的事件,释放内存的. OK,言归正传.判断元素上是否绑定过事件用如下语句 jQuery.data(elem,"events")[type] //老版本也能用 $(elem).data("events")[type] //1.2.3以后才能

jquery为链接a元素注册click事件并避免跳转现象

jquery为链接a元素注册click事件并避免跳转现象:在实际应用中,可能需要将链接a作为一个普通的按钮使用,但是由于点击按钮会导致跳转动作,下面就通过代码实例介绍一下如何实现点击功能,并且不会出现跳转现象,代码如下: <!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.

动态生成DOM元素绑定click事件无效问题

在页面里,jq动态生成dom节点,该节点的click事件无效. 如,html里动态添加class名为.del的<a>, js文件中: $('.del').bind('click',fuction(){ alert('sda'); }) 不响应, 网上说可以用live代替bind事件,但在jq1.7版本开始,就取消了live事件, 解决方法: on()事件 代码改为: $(document).on('click','.del',fuction(){ alert('sda'); }) 这样就搞定了

jquery动态生成元素的事件绑定

<html> <head> <meta charset="utf-8"> <meta name="view" content="width=device-width;user-scalable=no;initial-scale=1.0"> <script src="jquery.js"></script> <style> .image-host

JQuery注册元素组的点击事件

注册取到的元素组的点击事件//求出a组var linkButton=$("table").children("thead").children("tr") .children("th") .children("span") .children("a");//为a注册点击事件 linkButton.each( function(){ $(this).click(function(){ })

layUi 模板引擎动态创建元素之后,绑定的事件无效了;

模板引擎动态创建元素之后,绑定的事件无效了: layUi 模板引擎动态创建元素之后,绑定的事件无效了: 可以在 模板引擎成功后  注册事件 原文地址:https://www.cnblogs.com/lpp-11-15/p/12264046.html

Vue 接收数据for循环渲染出的标签jQuery渲染的点击事件无效

Vue 接收数据for循环渲染出的标签jQuery渲染的点击事件无效 Vue在渲染页面的时候使用jQuery的时候会发现当在created生命周期中获取后台数据,写在 mounted 生命周期的jquery渲染的点击事件不管用了. 理论上,mounted是界面html生成结束才会开始执行的,应该是可以的,但实际效果就是不行. 原因 问题的原因出现在,jquery确实在界面HTML生成之后执行了,但是当时向后台请求的数据还没请求回来,当请求回来用for循环重新渲染数据后,jquery已经执行完了,

jQuery之元素操作及事件绑定

1.操作元素之属性: ①attr读:("selector").attr("属性名"):=>getAttribute("属性名"):改: ("selector").attr("属性名",值):=>setAttribute("属性名",值):*(*无法访问不再开始标签中存在的prop属性:例:checked,selected,disabled): ②prop读:("se

js jquery插入元素后事件会被注销

  js jquery插入元素后事件会被注销 document.body.innerHTML += <div id="dd">test</div>  //这个会注销事件 $(document.body).append(str);//使用这个 也可以绑定事件. 例子: //快捷键双击 $(".app_shortcut_item").dblclick(function () { var id = $(this).attr("id&quo