jquery中的数组复选框验证

时间:2016-08-07 15:34:38

标签: javascript jquery html checkbox

我想使用Jquery验证一个Array复选框,但我不知道如何使用jquery验证复选框...这是我的代码

<div class="col-sm-8">
  <label class="checkbox-inline"><input type='checkbox' name='checkboxvar[]' value='0' id='checkboxvar[]'>L</label>
  <label class="checkbox-inline"><input type='checkbox' name='checkboxvar[]' value='1' id='checkboxvar[]'>M</label>
  <label class="checkbox-inline"><input type='checkbox' name='checkboxvar[]' value='2' id='checkboxvar[]'>Mi</label>
  <label class="checkbox-inline"><input type='checkbox' name='checkboxvar[]' value='3' id='checkboxvar[]'>J</label>
  <label class="checkbox-inline"><input type='checkbox' name='checkboxvar[]' value='4' id='checkboxvar[]'>V</label>
</div>

<script>
 function validate() {
        if($("#checkboxvar").is(':checked')) {
            alert("actived");
        } else {
            alert("No actived");
        }
    }
</script>

2 个答案:

答案 0 :(得分:2)

You can validate like below:

function validate(){
    if ($('input[name^=checkboxvar]:checked').length <= 0) {
        alert("Not active");
    }else{
        alert("active");
    }
}

答案 1 :(得分:1)

首先删除id重复。每页的ID应该是唯一的。

演示:https://jsfiddle.net/Prakash_Thete/bdjue21w/

如果要检查选中哪个复选框,则可以将公共类应用于所有复选框,然后遍历它并检查是否检查了其中任何一个。

如下所示

 function validate() {
    $(".checkboxvar").each(function(index){
       if($(this).is(':checked')){
        alert("checked element value : " + + $(this).val());
       } else{
       alert("unchecked element value: " + $(this).val());
       }
 });
 }

假设HTML是这样的:

<div class="col-sm-8">
  <label class="checkbox-inline"><input type='checkbox' name='checkboxvar[]' value='0' class='checkboxvar'>L</label>
  <label class="checkbox-inline"><input type='checkbox' name='checkboxvar[]' value='1' class='checkboxvar'>M</label>
  <label class="checkbox-inline"><input type='checkbox' name='checkboxvar[]' value='2' class='checkboxvar'>Mi</label>
  <label class="checkbox-inline"><input type='checkbox' name='checkboxvar[]' value='3' class='checkboxvar'>J</label>
  <label class="checkbox-inline"><input type='checkbox' name='checkboxvar[]' value='4' class='checkboxvar'>V</label>
</div>