Javascript Check and Uncheck All Checkboxes
2006-01-22 10:02
393 查看
Javascript Check and Uncheck All Checkboxes
By Nannette Thacker - 04/27/2000
6/7/01 update: Please see a response to a letter on this article for further details on how to check if there is only ONE checkbox in a set. (For instance, if you are building your set from a table and don't know if there is more than one checkbox in the set or not.) Letters
By passing the checkbox group's name to the onclick event of the buttons, you can check and uncheck all checkboxes dynamically. You don't need to hard code the name of the checkbox or know the number of check boxes in the group. The code takes care of this automatically.
Your Favorite Scripts & Languages
Java
Javascript
Active Server Pages
HTML
SQL
Here is the javascript:
Here is the HTML:
Check out The JavaScript Source for some of the BEST javascripts!
Check out this COOL RGB/HEX Converter chart! http://javascript.internet.com/calculators/rgb-slider.html
By Nannette Thacker - 04/27/2000
6/7/01 update: Please see a response to a letter on this article for further details on how to check if there is only ONE checkbox in a set. (For instance, if you are building your set from a table and don't know if there is more than one checkbox in the set or not.) Letters
By passing the checkbox group's name to the onclick event of the buttons, you can check and uncheck all checkboxes dynamically. You don't need to hard code the name of the checkbox or know the number of check boxes in the group. The code takes care of this automatically.
Your Favorite Scripts & Languages
Java
Javascript
Active Server Pages
HTML
SQL
Here is the javascript:
<SCRIPT LANGUAGE="JavaScript"> <!-- // by Nannette Thacker // http://www.shiningstar.net // This script checks and unchecks boxes on a form // Checks and unchecks unlimited number in the group... // Pass the Checkbox group name... // call buttons as so: // <input type=button name="CheckAll" value="Check All" //onClick="checkAll(document.myform.list)"> // <input type=button name="UnCheckAll" value="Uncheck All" //onClick="uncheckAll(document.myform.list)"> // --> <!-- Begin function checkAll(field) { for (i = 0; i < field.length; i++) field[i].checked = true ; } function uncheckAll(field) { for (i = 0; i < field.length; i++) field[i].checked = false ; } // End --> </script> |
Here is the HTML:
<form name="myform" action="checkboxes.asp" method="post"> <b>Your Favorite Scripts & Languages</b><br> <input type="checkbox" name="list" value="1">Java<br> <input type="checkbox" name="list" value="2">Javascript<br> <input type="checkbox" name="list" value="3">Active Server Pages<br> <input type="checkbox" name="list" value="4">HTML<br> <input type="checkbox" name="list" value="5">SQL<br> <input type="button" name="CheckAll" value="Check All" onClick="checkAll(document.myform.list)"> <input type="button" name="UnCheckAll" value="Uncheck All" onClick="uncheckAll(document.myform.list)"> <br> </form> |
Check out The JavaScript Source for some of the BEST javascripts!
Check out this COOL RGB/HEX Converter chart! http://javascript.internet.com/calculators/rgb-slider.html
相关文章推荐
- javascript Check All, Uncheck All and check one at least
- Check/Uncheck All Checkboxes in Asp.Net Gridview
- 【原】用使用JavaScript展开/折叠TreeView中所有节点(Expand and Collapse All Nodes of asp.net Treeview on the client with javascript)
- Summary : Creating Dialog Boxes using ASP.NET, JavaScript and IE
- Check (Validate) File (Image) Size before upload using JavaScript and jQuery
- Asp.Net 2.0 Treeview Checkbox Check/Uncheck All script
- disable-the-loopback-check-for-specific-host-names-on-all-sharepoint-web-and-application-servers/
- javascript - Parsing through DOM get all children and values - Stack Overflow
- Check All Checkboxes with JQuery[转]
- Sams Teach Yourself Ajax, JavaScript, and PHP All in One
- XHtmlTree - Tree control with support for HTML, XML, Smart Checkboxes, and Drag & Drop
- 【原】父子树的选择【全选/不全选】Asp.Net 2.0 Treeview Checkbox Check/Uncheck All script
- Javascript Object Method Properties console.log View all methods and properties of the object
- Checking All CheckBoxes in a GridView
- simple jQuery (check and uncheck)
- spring <form:checkboxes> tag and css class
- Handling Checkboxes, Radio Buttons and Select Options in jQuery [转]
- Custom Alert Boxes using JavaScript and the DOM
- 使用JavaScript展开/折叠TreeView中所有节点(Expand and Collapse All Nodes of asp.net Treeview on the client with javascript)
- Truthy and Falsy: When All is Not Equal in JavaScript