jquery中的数组复选框验证

Array Checkbox validation in jquery

本文关键字：复选框 验证 数组 jquery      更新时间：2023-09-26

我想使用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>

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

首先删除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>
相关文章：