January 16, 2016
HomejQuery QuestionsHow to Uncheck All Checkboxes Using jQuery

How to Uncheck All Checkboxes Using jQuery

By  jQuery Questions  0 Comments

To ubcheck all checkboxes in jQuery, we make use of prop() function with attribute value selector.  This function is only available in jQuery 1.6 or higher.  For jQuery 1.5 or lower, please make use of attr() function.  Example is given below for jQuery 1.6 or higher.

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<!DOCTYPE html>
<html>
<head>
<title>jQuery Tutorial </title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
//Function to Check checkbox.
function CheckAll(){
$('[type="checkbox"]').prop("checked", true) ;
}
//Function to Uncheck checkbox.
function UncheckAll(){
$('[type="checkbox"]').prop("checked", false) ;
}
</script>
</head>
<body>
My Checkbox:
<input type="checkbox" /><input type="checkbox" /><input type="checkbox" />
<input type="button" value="Check" onclick="CheckAll()"/>
<input type="button" value="Uncheck" onclick="UncheckAll()"/>
</body>
</html>
<!DOCTYPE html> <html> <head> <title>jQuery Tutorial </title> <script src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript"> //Function to Check checkbox. function CheckAll(){ $('[type="checkbox"]').prop("checked", true) ; } //Function to Uncheck checkbox. function UncheckAll(){ $('[type="checkbox"]').prop("checked", false) ; } </script> </head> <body> My Checkbox: <input type="checkbox" /><input type="checkbox" /><input type="checkbox" /> <input type="button" value="Check" onclick="CheckAll()"/> <input type="button" value="Uncheck" onclick="UncheckAll()"/> </body> </html>
<!DOCTYPE html>
<html>
<head>
<title>jQuery Tutorial </title>
 
<script src="http://code.jquery.com/jquery-latest.js"></script>
 
<script type="text/javascript">
 
//Function to Check checkbox.
function CheckAll(){
    
    $('[type="checkbox"]').prop("checked", true) ;
 }

//Function to Uncheck checkbox.
function UncheckAll(){
    
    $('[type="checkbox"]').prop("checked", false) ;
 } 
</script>
 
</head>
<body>
 
My Checkbox:
<input  type="checkbox" /><input  type="checkbox" /><input  type="checkbox" />
<input type="button" value="Check" onclick="CheckAll()"/>
<input type="button" value="Uncheck" onclick="UncheckAll()"/>

</body>
</html>

 

 
         

You May Also Like:

How to Uncheck a Checkbox Using jQuery How to Check All Checkboxes Using jQuery How to Uncheck a Radio Button Using jQuery How to Check and Uncheck All Checkboxes using Javascript How to Uncheck All Checkboxes Using JavaScript