AI智能
改变未来

jQuery解决添加元素后不执行原有事件的方法

我们先来看下我的错误代码

html:

<table border=\"1\" id=\"best\"><tr><td><button class=\"change\">修改</button></td></tr><tr><td><button class=\"del\">删除</button></td></tr><tr class=\"last\"><td><button class=\"add\">添加</button></td></tr></table>

js:

$(\".add\").click(function(){var newYuansu = $(\"<tr><td><button class=\'del\'>删除</button></td></tr>\");$(\".last\").before(newYuansu);})$(\".del\").click(function(){$(this).parents(\"tr\").remove();})

而此时使用jQuery新加元素,新元素元素不会执行一部分原有的事件函数

博主是学生,也只是研究了一种方法:

$(\"#best\").on(\"click\",\".del\",function(){$(this).parents(\"tr\").remove();})

把原本的click事件这样写,就可在新加的元素使用,非常好用~

补充:

一、jquery1.3版本以下的(不包括jquery1.3),是时候更新你的jquery版本了。

因为 无解无解无解无解无解无解

二、如果jquery版本是在1.3-1.8之间的话,js/jq动态添加的元素触发绑定事件的解决方法(不建议用on事件,因为1.6版本以下不支持on事件,会报错)

绑定live事件(live事件只在jquery1.9以下才支持,高版本不支持)。

$(\".del\").live(\"click\",function(){ ///jquery 1.9(不包括1.9)以下可以alert(\'这里是动态元素添加的事件\');})

三、推荐使用on

如果jquery版本是在1.9或者更高的话,live委托事件是被移除的,通过on来实现。js/jq动态添加的元素触发绑定事件的解决方法

注意注意:如果页面同时存在低版本的jq(1.3-1.8)和高版本jq(jquery1.9以上)的话,live委托事件会被高版本移除,最后导致虽然有jquery版本是在1.3-1.8之间,使用了live事件,页面会报错。

到此这篇关于jQuery解决添加元素后不执行原有事件的方法的文章就介绍到这了,更多相关jQuery的内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

您可能感兴趣的文章:

  • jQuery 添加元素和删除元素的方法
  • Jquery 动态添加元素并添加点击事件实现过程解析
  • JQuery绑定事件四种实现方法解析
  • jQuery 移除事件的方法
赞(0) 打赏
未经允许不得转载:爱站程序员基地 » jQuery解决添加元素后不执行原有事件的方法