Home > Developer > Web Develop
<!DOCTYPE HTML><HTMLxmlns= "http://www.w3.org/1999/xhtml"><Head> <Metaname= "Generator"content= "EditPlus" /> <title>Output the number of selected check boxes</title> <Scriptsrc= "Jquery-1.7.1.min.js"type= "Text/javascript"></Script> <!--idea: 1. Create a new empty array. 2. Get all the checkboxes with the name "check". 3. Loop to determine if the multi-box is selected and added to the array if selected. 4. Get the output button and then add the OnClick event to the button to output the array length. -</Head><Body> <inputtype= "checkbox"value= "1"name= "Check"checked= "Checked" /> <inputtype= "checkbox"value= "2"name= "Check" /> <inputtype= "checkbox"value= "3"name= "Check" /> <inputtype= "checkbox"value= "4"name= "Check"checked= "Checked" /> <inputtype= "button"value= "Number of your selected"ID= "BTN" /> <Scripttype= "Text/javascript"> //Traditional methods: //var btn = document.getElementById ("btn"); Get the element with ID btn (button) //Btn.onclick = function ()//Add onclick event to element //{ //var arrays = new Array (); Create an Array object //var items = document.getelementsbyname ("check");//Get a set of elements with the name check (checkbox) //For (var i = 0; i < items.length; i++)//cycle This set of data // { //if (items[i].checked)//Decide whether to select // { //Arrays.push (Items[i].value); Add qualifying data to the array ////push () is a method in a JavaScript array // } // } //alert ("Number of selected:" + arrays.length); //} //jquery Method: $('#btn'). Click (function () { varlength= $("input[name= ' Check ']:checked"). length; //Use the property selector first, then filter with the Form object properties, and finally get the length of the jquery objectAlert ("the number of checks is:" +length); }) </Script></Body></HTML>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
