如果在页面初始加载时未选中复选框，则返回无效提交

Posted 2023-05-09

【中文标题】如果在页面初始加载时未选中复选框，则返回无效提交

【英文标题】：Return invalid submission if no Checkbox is checked on initial load of the page

【发布时间】：2019-11-15 00:45:24

【问题描述】：

如果在初始加载时提交表单时没有任何选择，我需要触发错误处理程序。如果我在文档就绪功能的每个复选框上添加 .prop('required', true) ，它将包括具有从我们的数据库加载的值的其他复选框。这意味着尽管已经选择了字段，但我的错误处理程序会触发。

所以我在“onsubmit”函数之外尝试了这段代码：

$(this).find('input[type=checkbox]').filter(':checked').length;
$('.cboxgrp').each(function()
if(cboxgrp===0)
$(this).find('input[type=checkbox]').prop('require',true);

它在初始提交尝试时按预期工作，如果表单没有选中任何复选框，它会触发我的错误处理程序，但是，如果我测试了我的其他已选中复选框的表单，我的错误处理程序也会被触发。

下面是我当前的代码：

$(#form).on('submit', function()
$(this).find('input[type=checkbox]').filter(':checked').length;
$('.cboxgrp').each(function()
if(cboxgrp===0)
$(this).find('input[type=checkbox]').prop('require',true););

上述代码的结果比我预期的多 1 次鼠标点击（字面意思）。这将在第一次单击提交按钮时将复选框设置为必需，然后在第二次尝试时显示我的错误处理程序。

有没有办法让我的错误处理程序在初始加载时触发，而无需在文档准备好时将复选框设置为“必需”？

【参考方案1】：

试试下面的代码

$(document).ready(function()
  $('form :checkbox', this).each(function()
     var checkbox = $(this);
     if( ! checkbox.is(':checked'))
       checkbox.prop('required', true);
     
  )
)

【讨论】：

我试过你的建议，它仍然包括所有的复选框。

【参考方案2】：

试试$(this).find(':checkbox:not(:checked)').prop('required',true);

【讨论】：

我也试过这个。在初始加载时已经有一些选择的表单也会触发我的 errorHandler。