【简单】js控制CheckBox全选/全不选

最新推荐文章于 2023-12-07 16:39:21 发布

转载最新推荐文章于 2023-12-07 16:39:21 发布 · 91 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/yijia/archive/2012/03/27/2419271.html

文章标签：

#xhtml #javascript #ViewUI

本文提供了一个简单的HTML和jQuery示例，展示了如何实现网页元素的全选功能。通过创建一个全选按钮，点击该按钮可以同时选中页面上的所有复选框。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

View Code

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 
 3 <html xmlns="http://www.w3.org/1999/xhtml">
 4 <head runat="server">
 5     <title></title>
 6     <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
 7     <script type="text/javascript">
 8         function selectAll(checkbox) {
 9             $('input[type=checkbox]').attr('checked', $(checkbox).attr('checked'));
10         }
11         </script>
12 </head>
13 <body>
14     <form id="form1" runat="server">
15     <div>
16     <input type="checkbox" onclick="selectAll(this);" />全选<br/>
17         <input type="checkbox"  /><br/>
18         <input type="checkbox"  /><br/>
19         <input type="checkbox"  /><br/>
20         <input type="checkbox"  /><br/>
21         <input type="checkbox"  /><br/>
22         <input type="checkbox"  /><br/>
23     </div>
24     </form>
25 </body>
26 </html>
27