Question

晕我仍然混淆如何在提交之前验证多个复选框。情况就是这样。至少用户至少可以提交一个已选中的复选框。和我的代码是这样的。如果为空，我将返回错误消息或警报。

<form name="form" id="formid" action="" method="post">

<button class="primary-slim-btn" id="button_submit">submit</button>
<input type="checkbox" name="number[]" value="1" />One<br />
<input type="checkbox" name="number[]" value="2" />Two<br />
<input type="checkbox" name="number[]" value="3" />Three<br />
<input type="checkbox" name="number[]" value="4" />Four<br />
<input type="checkbox" name="number[]" value="4" />Five<br />
<button class="primary-slim-btn" id="button_submit">submit</button>
</form>


<script type="text/javascript">
  $('#button_submit').click(function() {
      var check_box_values = $('#formid [type="checkbox"]:checked');
      if(check_box_values == no check){
        alert('Please choose first');
      }
  });
</script>

我该如何进行验证。请帮助

Answer 1

您几乎明白了，但应该进行两项更改：

使用check_box_values.length===0检查列表中是否没有元素，并且
您需要附加onSubmit事件而不是onClick才能阻止提交：

    <form name="form" id="formid" action="" method="post">
      <input type="checkbox" name="number[]" value="1" />One<br />
      <input type="checkbox" name="number[]" value="2" />Two<br />
      <input type="checkbox" name="number[]" value="3" />Three<br />
      <input type="checkbox" name="number[]" value="4" />Four<br />
      <input type="checkbox" name="number[]" value="4" />Five<br />
      <input type="submit" value="Submit" id="submitBtn" />
    </form>


    <script type="text/javascript">
      $('#formid').submit(function(e) {
          var check_box_values = $('#formid [type="checkbox"]:checked');
          if(check_box_values.length===0){
            alert('Please choose first');
            e.preventDefault()
          }else{
            return true;
          }
      });
    </script>

Answer 2

$('#submitBtn').click(function() {
  var atLeastOneIsChecked = $('input[name="number[]"]:checked').length > 0;
    if(!atLeastOneIsChecked)
    {
    alert('Please choose first');
   } 
  });

类似的东西...

提交前验证多个复选框

2 个答案: