首页 > 代码库 > jquery获取复选框的值
jquery获取复选框的值
勾选checkbox，并把勾选的值显示在某个div中
1 <!DOCTYPE html > 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title> 获取爱好 </title> 6 <meta http-equiv = "content-type" content ="text/html;charset=utf-8" /> 7 <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script> 8 <script type="text/javascript" > 9 $(document).ready(function(){10 //全选11 $("input[name=‘quanxuan‘]").click(function(){12 $("input[type=‘checkbox‘]").attr("checked","checked");13 });14 15 //取消16 $("input[name=‘quxiao‘]").click(function(){17 $("input[type=‘checkbox‘]").removeAttr("checked");18 });19 //查看我的爱好20 $("input[type=‘button‘]").click(function(){21 //获取所有checkbox22 var str="";23 $("input[type=‘checkbox‘]:checked").each(function(){24 str +=$(this).val()+"<br/>";25 $("#text").html(str);26 27 });28 29 30 });31 })32 33 </script>34 </head>35 36 <body>37 <form id="myForm">38 <h3>选择你的爱好：</h3>39 <ul id="hobby">40 <li><input type="checkbox" value="音乐" />音乐</li>41 <li><input type="checkbox" value="登山" />登山</li>42 <li><input type="checkbox" value="游泳" />游泳</li>43 <li><input type="checkbox" value="阅读" />阅读</li>44 <li><input type="checkbox" value="打球" />打球</li>45 <li><input type="checkbox" value="跑步" />跑步</li>46 <li><input type="checkbox" value="其他" />其他</li>47 </ul>48 <input type="button" name="quanxuan" value="全选"/>49 <input type="button" name="quxiao" value="全取消"/>50 <hr/>51 52 <ul>53 <li><input type="button" value="查看我选择的爱好" /></li>54 </ul>55 <p id="text"></p>56 57 </form>58 <script type="text/javascript">59 60 61 </script>62 63 </body>64 </html>
jquery获取复选框的值
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。