为什么我用jquery点击添加的元素，不能进行点击移除
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Document</title><scrip...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="jquery-2.1.1.min.js"></script>
<style type="text/css">
.aa{
width: 200px;
height: 200px;
background:red;
float: left;
border: solid 1px #fff;
}
.bb{
width: 20px;
height: 20px;
text-align: center;
line-height: 20px;
background: #fff;
float: right;
cursor: pointer;
right: 0;
}
.cc{
width: 200px;
height: 200px;
background:blue;
float: left;
}
</style>
</head>
<body>
<div class="aa">
<div class="bb">x</div>
</div>
<div class="cc"></div>
</body>
<script type="text/javascript">
$(".cc").click(function(){
$(this).before("<div class='aa'><div class='bb'>x</div></div>");
})
$(".bb").click(function(){
var cls = this.parentNode;
cls.remove();
})
</script>
</html>
只有原先写的能进行点击，之后用jquery添加的都不能点击，要怎么解决？ 展开
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="jquery-2.1.1.min.js"></script>
<style type="text/css">
.aa{
width: 200px;
height: 200px;
background:red;
float: left;
border: solid 1px #fff;
}
.bb{
width: 20px;
height: 20px;
text-align: center;
line-height: 20px;
background: #fff;
float: right;
cursor: pointer;
right: 0;
}
.cc{
width: 200px;
height: 200px;
background:blue;
float: left;
}
</style>
</head>
<body>
<div class="aa">
<div class="bb">x</div>
</div>
<div class="cc"></div>
</body>
<script type="text/javascript">
$(".cc").click(function(){
$(this).before("<div class='aa'><div class='bb'>x</div></div>");
})
$(".bb").click(function(){
var cls = this.parentNode;
cls.remove();
})
</script>
</html>
只有原先写的能进行点击，之后用jquery添加的都不能点击，要怎么解决？ 展开
展开全部
时序问题。
你之前写的是在页面加载完成之后 jquery 会进行DOM节点绑定，所以能移除
之后你点击节点添加，只是添加页面元素，但是这个元素并没有绑定任何事件，所以不能点击移除。
$(".cc").click(function () {
$(this).before("<div class='aa'><div class='bb'>x</div></div>");
bb();
});
var bb = function () {
$(".bb").click(function () {
var cls = $(this).parent().remove();
})
};
bb();
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
新添加的元素未进行点击事件移除的绑定
$(".bb").click(function(){
var cls = this.parentNode;
cls.remove();
})这句只在页面初始化时执行，新添加的元素未能绑定事件；将这句绑定事件的集成方法，在新添加元素中直接使用onclick绑定；即：
$(".cc").click(function(){
$(this).before("<div class='aa'><div class='bb' onclick='remove(this)'>x</div></div>");
})
function remove(obj){
$(obj).remove();
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
对于动态生成的dom元素，需要委派处理。。。
$("body").delegate(".bb","click",function(){$(this).parent(".aa").remove();});
$("body").delegate(".bb","click",function(){$(this).parent(".aa").remove();});
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
