当我选中红色按钮时,文本框后面就会出现一个红色图标;当我再选中一个蓝色按钮时,文本框后面就会既有红色图标又有蓝色图标。当我把红色按钮取消时,红色图标就会消失。当取消时怎么让图片消失?
示例代码如下:
<script>
function test(){
if($("#aaa").attr("checked")==true){
$("#ccc").append("<img src='red.png'/>");
}
else{
$("#ccc").remove("<img src='red.png'/>");
}
}
</script>
<body>
<div>
姓名:<input id="ccc" type="text" value=""/>
多选框:
<input type="checkbox" value="red" id="aaa">红色
<input type="checkbox" value="blue" id="bbb">蓝色
</div>
</body>
示例代码如下:
<script>
function test(){
if($("#aaa").attr("checked")==true){
$("#ccc").append("<img src='red.png'/>");
}
else{
$("#ccc").remove("<img src='red.png'/>");
}
}
</script>
<body>
<div>
姓名:<input id="ccc" type="text" value=""/>
多选框:
<input type="checkbox" value="red" id="aaa">红色
<input type="checkbox" value="blue" id="bbb">蓝色
</div>
</body>
$("#ccc").remove($("<img src='red.png'/>"));
var $img = $("<img src='red.png'/>");
if($("#aaa").attr("checked")==true){
$("#ccc").append($img);
}
else{
$("#ccc").remove($img);
}
}
这样试 你两次append 和remove 的 不是一个对象
如果这样还不行 那你就给你生成的那个img 加一个ID remove时先找到这个ID的图 再remove
<div>
姓名:<input id="ccc" type="text" value="" />
<img src='red.png' id="red" style="display: none;" />
多选框:
<input type="checkbox" value="red" id="aaa">红色
<input type="checkbox" value="blue" id="bbb">蓝色
</div>
</body>
</html>
<script>
$(function () {
//点击红色复选框的时候
$("#aaa").bind("click", function () {
//如果当前这个复选框被选上
if (this.checked == true) {
//显示图片
$("#red").show();
}
else {
//隐藏图片
$("#red").hide();
}
})
})
</script>
append方法是在内部追加加入img,应该是after("<img src='red.png'/>"),在元素后加入删除的是$("#ccc").next().remove();