开发者社区> 问答> 正文

jquery checkbox的问题:报错

<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.3.min.js"></script>
	<script language="javascript" type="text/javascript">
	
	$(document).ready(function(){
       $(".js").click(function(){
                     
                   var aa="";
                               $("input[name=checkbox1]").each(function(){
                    	         if(this.checked){
                            	
                                    aa=this.value;
                                         $("#www").append("<img src="+aa+">");
                                                                   
                                                                }
                    })
  })
})

		
		</script>
<body>
<table width="485" height="27" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <th width="159" scope="col"><img src="1.jpg" width="100" height="69" /></th>
    <th width="159" scope="col"><img src="2.jpg" width="100" height="69" /></th>
    <th width="159" scope="col"><img src="3.jpg" width="100" height="69" /></th>
    <th width="159" scope="col"><img src="4.jpg" width="100" height="69" /></th>
  </tr>
  <tr class="js">
    <th scope="col"><input type="checkbox" name="checkbox1"  value="1.jpg" ></th>
    <th scope="col"><input type="checkbox" name="checkbox1"  value="2.jpg" ></th>
    <th scope="col"><input type="checkbox" name="checkbox1"  value="3.jpg" ></th>
    <th scope="col"><input type="checkbox" name="checkbox1"  value="4.jpg" ></th>
  </tr>
  
  <tr>
    <th width="159" scope="col"><img src="1.jpg" width="100" height="69" /></th>
    <th width="159" scope="col"><img src="2.jpg" width="100" height="69" /></th>
    <th width="159" scope="col"><img src="3.jpg" width="100" height="69" /></th>
    <th width="159" scope="col"><img src="4.jpg" width="100" height="69" /></th>
  </tr>
  <tr class="js">
    <th scope="col"><input type="checkbox" name="checkbox1"  value="1.jpg" ></th>
    <th scope="col"><input type="checkbox" name="checkbox1"  value="2.jpg" ></th>
    <th scope="col"><input type="checkbox" name="checkbox1"  value="3.jpg" ></th>
    <th scope="col"><input type="checkbox" name="checkbox1"  value="4.jpg" ></th>
  </tr>
  <div id="www"></div>
</table>
</body>
 

现在的问题是我选择了一下复选框,出现一个选择的图片,然后再选择一个,会出现在上次选择的图片和这次选择的图片,变成三张图片,实际应该是两张,尝试使用$("#www").remove();无效,该咋解决啊

 

展开
收起
kun坤 2020-06-06 22:51:35 452 0
1 条回答
写回答
取消 提交回答
  • 每点一次,遍历一次所有复选框,有选中的就append对应jpg,第一次点击append了一张,第二次点击,有两个选中,在第一次append的基础上又append了两张。
    运行结果:3张,没错……

    解决方法:.click里面每次.each之前,清空$("#www")的子元素——var aa="";$('#www').empty();——然后再.each

    =================================================
    2020-06-06 22:51:42
    赞同 展开评论 打赏
问答分类:
问答标签:
问答地址:
问答排行榜
最热
最新

相关课程

更多

相关电子书

更多
23-Vue.js在前端...1506518547.pdf 立即下载
低代码开发师(初级)实战教程 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载