In a recruitment website, by limiting the number of job tags selected by users, you can accurately locate the user's position. For example, the user is provided with an alternative position tag in the form of a check box, restricting the user from selecting up to 3, and prohibiting the user from continuing to select when more than three.
Check boxes are used in questionnaire surveys, and recruitment websites are widely used. Today, let’s introduce how to limit the number of options to select at most:
Ideas:
Listen to the onclick event of the checkbox
checkbox.onclick = function(){ //Code block}Listen to checked properties of checkbox:
if(chckbox.checked){ //Code block}HTML code:
< input type= "checkbox" name= "sport"/>Basketball<br />< input type= "checkbox" name= "sport"/>Football<br />< input type= "checkbox" name= "sport"/>Volleyball<br />< input type= "checkbox" name= "sport"/>Badminton<br />< input type= "checkbox" name= "sport"/>Table tennis<br />< p>Select up to three items</p>
JavaScript code:
var sportSelect = document.getElementsByName('sport' ), maxNums = 3; for(var i in sportSelect){ sportSelect[i]. onclick = function (){ var _sportSelect = document.getElementsByName('sport' ), cNums = 0; for(var i in _sportSelect){ if(i == 'length') break ; if(_sportSelect[i].checked){ cNums ++; } } if(cNums > maxNums){ this.checked = false; alert('Can only choose three items at most'); } } }The implementation code for the most selected items in the above restricted check box is all the content I have shared with you. I hope you can give you a reference and I hope you can support Wulin.com more.