可以在w3school测试一下,是否可用,然后慢慢体会。 注意添加是定位(.info),那个(.info)新的节点的绑定事件也应该以他为开始。‘delete’ 必须是(.info)的子节点,即你添加中的几个地位标示。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>测试</title>
<script src="/jquery/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>
总结:
当动态创建元素的父级没有添加事件情况下,动态创建的元素可以用on或live绑定事件;
当动态创建元素的父级有绑定事件情况下,动态创建的元素用on