Check Box Using JQuery

Question:

Create a page in a file named jqcheckbox.html where in to check whether check box is selected or checked. Indicate the number of check boxes checked. 
Use a <div>  tag with id as “result” to display the output.
Jquery Library – https://code.jquery.com/jquery-1.10.2.js
Sample of the page before checked
Quiz for Exam -  Check Box Using JQuery
Sample of the page after checked
Quiz for Exam -  Check Box Using JQuery

Code:

jqcheckbox.html

<html>
   <head>
       <script src="https://code.jquery.com/jquery-1.10.2.js">
       </script>
       <script>
           $(document).ready(function(){
               var $checkboxes=$('#a td input[type="checkbox"]');
               $checkboxes.change(function(){
                  var ccc=$checkboxes.filter(':checked').lenght;
                  $('span').text(ccc);
               });
           });
       </script>
   </head>
   <body>
       <form id="a">
           <table>
               <tr>
                   <td><input type="checkbox" name="color" value="Red">Red</td>
                   <td><input type="checkbox" name="color" value="Green">Green</td>
                   <td><input type="checkbox" name="color" value="Blue">Blue</td>
                   <td><input type="checkbox" name="color" value="Black">Black</td>
               </tr>
           </table>
       </form>
       <div id="result"><span>0</span> are checked </div>
   </body>
</html>

Recommended:

Leave a Comment

Your email address will not be published. Required fields are marked *

x