简体   繁体   中英

Check if checkbox checked property is not empty using jQuery

How can I check checkboxes checked property? If any of them is not checked, display this sentence in span: "you shoud select one of them". My validation don't work.

<label>
    <input type="checkbox" name="chk[]" id="chk[]" />male
</label>
<label>
    <input type="checkbox" name="chk[]" id="chk[]" />female
</label>

<script>
    if ($('input[name="chk[]"]:checked').length < 0) {
        $("#textspan").html('you shoud select one of them');
    }
</script>

As far as your specific question goes, when no checkbox is checked $('input[name="chk[]"]:checked').length is 0, not negative - so you should change the condition from if ($('input[name="chk[]"]:checked').length < 0) to if ($('input[name="chk[]"]:checked').length == 0)

Full example

Other than that, some side notes: 1. I'd use radio buttons (as it is more suitable for your current male / female selection). 2. You have the same ID ( chk[] ) twice, which renders your HTML invalid. 3. The [] characters in the ID are not permitted in HTML 4.1 standards, and do not suit the convention.

I took the liberty of changing the code a bit, as your HTML is a bit strange.

Working example: http://jsfiddle.net/a4jzvoou/

HTML:

<div>
    <input type="checkbox" class='gender' id="male">male</input>
    <input type="checkbox" class='gender' id="female">female</input>
</div>
<button class="validate">Validate</button>

JS:

$(function() {
  $('.validate').click(function(event) {     
     var checkedCount = ($('input[class="gender"]:checked').length))        
  })   
});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM