有没有办法在提交之前检查表单以查看是不是已选中任何复选框？

Posted 2023-03-16

【中文标题】有没有办法在提交之前检查表单以查看是不是已选中任何复选框？

【英文标题】：Is there a way to check a form before submitting it to see if ANY of the checkboxes have been checked?有没有办法在提交之前检查表单以查看是否已选中任何复选框？

【发布时间】：2011-06-18 23:18:11

【问题描述】：

有没有办法在提交表单之前检查表单是否已在 javascript 中选中任何复选框？

类似...

function checkboxcheck()
/*something in here to check name="brands[]" checkbox array?*/

基本上我只是希望它在选择 0 个复选框时提醒我。需要 1 个或更多。

我会在提交时调用这个函数。

非常感谢！！

【问题讨论】：

你试过使用像jquery这样的框架吗？

我听说过它，但以前没有用 jquery 做过任何事情。你认为这是唯一的方法吗？如果是这样，你能指出我正确的方向吗？谢谢！

NCoder：你不必使用 jQuery，它只是让 JS 的生活更轻松。 Pointy 下面的函数可以表示为：($('input:checkbox:checked').length > 0)

【参考方案1】：

你可以这样做：

function anyCheckboxesChecked() 
  var inputs = document.getElementsByTagName('input');
  for (var i = 0; i < inputs.length; ++i) 
    if (inputs[i].type === "checkbox" && inputs[i].checked)
      return true;
  
  return false;

然后你可以从你的“提交”处理程序中调用那个函数”

   if (!anyCheckboxesChecked()) 
     alert("Please check one of the appealing checkboxes on the page");
     return false;
   

如果您的页面比这暗示的更复杂（例如，如果有多个表单），那么您应该首先找到适当的表单并从该点调用.getElementsByTagName()，而不是从document。

【参考方案2】：

怎么样：

function checkboxcheck(name) 
    var els = document.getElementsByName(name);

    for (var i = 0; i < els.length; i++) 
        if (els[i].checked) 
            return true;
        
    
    return false;

使用getElementsByName()。

用法：

var valid = checkboxcheck("brands[]");

这是一个例子：http://jsfiddle.net/andrewwhitaker/2saJp/1/