jquery append 动态添加的元素事件on 不起作用的解决方案
更新时间：2015年07月30日 15:48:25 作者：机器有毒
这篇文章主要介绍了jquery append 动态添加的元素事件on 不起作用的解决方案,需要的朋友可以参考下
用jquery添加新元素很容易，面对jquery append 动态添加的元素事件on 不起作用我们该如何解决呢？on方法中要先找到原选择器（如例.info),再找到动态添加的选择器（如列.delete)。
具体不多说了，请看下面的代码吧。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>测试</title>
<script type="text/javascript"
src="../resources/js/jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(function(){
//动态添加
$(".add").on("click",function(){
console.log("进来了");
$(".info").append('<div class="delete"><h3>单击我来删除我</h3></div>');
});
//对动态添加的元素添加事件-删除
$(".info").on("click",".delete",function(){
console.log("进来了Delete！");
$(this).remove();
});
});
</script>
</head>
<body>
<h2 class='add'>单击我添加动态元素</h2>
<div class="info"></div>
</body>
</html>
以上代码就是本文对jquery append 动态添加的元素事件on 不起作用的解决方案，希望对大家学习有所帮助。
相关文章
在jQuery中,常常需要对元素的某个属性或数值进行比较,判断是否大于等于某个特定的值,在这种情况下,使用大于等于（>=）操作符是非常常见的,本文将介绍如何在jQuery中使用大于等于操作符的技巧,需要的朋友可以参考下2024-09-09
这篇文章主要介绍了jQuery绑定自定义事件使用技巧,通过循环绑定所有的自定义事件,在恰当的时机调用,需要的朋友可以参考下。2016-06-06
这篇文章主要介绍了jQuery中slideUp()方法用法,以实例形式分析了slideUp()方法的功能、定义及具体使用技巧,具有一定的参考借鉴价值,需要的朋友可以参考下2014-12-12
这篇文章主要介绍了使用jquery.form.js实现图片上传的方法,涉及jquery使用表单插件jquery.form.js进行图片上传的提交、类型验证、执行结果回调显示等技巧,非常简单实用,需要的朋友可以参考下2016-05-05
短几句jquery代码实现一个图片向上滚动切换，需要的朋友可以参考下。2011-09-09
浅谈EasyUi ComBotree树修改 父节点选择的问题
下面小编就为大家带来一篇浅谈EasyUi ComBotree树修改 父节点选择的问题。2016-11-11
jQuery获取文本节点之 text()/val()/html() 方法区别
在jquery中val,text,html都能取到值,或加一个参数来赋值,那么它们有些什么区别?2011-03-03
之前有碰到过jQuery实现列表自动滚动，这次的图片轮播在原理上与之相同，只有一些细微的差别，就是需要在图片的右下角显示当前图片的序号2013-09-09
each()方法能使DOM循环结构简洁，不容易出错。each()函数封装了十分强大的遍历功能，使用也很方便，它可以遍历一维数组、多维数组、DOM, JSON 等等，在javaScript开发过程中使用$each可以大大的减轻我们的工作量。2015-05-05
利用JQuery动态添加的按钮无法通过$(selector).click方法触发点击事件,下面小编给大家带来了JQuery动态生成的按钮无法触发问题与解决方法,需要的朋友可以参考下2023-02-02
最新评论