如何发现至少有一个复选框被选中或没有使用javascript

how to find that atleast one checkbox is checked or not using javascript

本文关键字：javascript 复选框 何发现 发现 有一个      更新时间：2023-09-26

我尝试了很多选项，但都没有成功。

主要的问题是，我有这么多复选框，它们都是通过php循环生成的，所以它们有相同的名称和id。我想在提交该表单时检查一下，至少应该检查一个。我已经尝试了很多功能，所以不确定哪一个应该粘贴在这里。所以，最好有人给我一些新的答案。

function Validate_Checkbox()
{
    var chks=document.getElementsByTagName('input');   
    var hasChecked = false;
    for (var i = 0; i < chks.length; i++)
    {
        if (chks[i].checked)
        {
            hasChecked = true;
            break;
        }
    }
    if (hasChecked == false)
    {
        alert("Please select at least one checkbox..!");
        return false;
    }
    return true;
}

它在形式标签中被称为onsubmit="return Validate_Checkbox()"。

基本上，我正在寻找一个JavaScript函数。

您的代码可以满足您所描述的目的。它可能更短，但没有明显的问题

缩短版

function validate_checkbox() {
    var cbs = document.getElementsByTagName('input');
    for (var i=0, len = cbs.length; i < len; i++)
        if (cbs[i].type.toLowerCase() == 'checkbox' && cbs[i].checked)
            return true;
    alert("Please check at least one checkbox");
    return false;
}

更短的版本（如果你不在乎旧的IE）

function validate_checkbox() {
    var checked = document.querySelectorAll('input[type=checkbox]:checked').length;
    if (!checked) alert("Please select at least one checkbox");
    return !!checked;
}

注：

1） ID必须是唯一的-不能在多个元素中重复ID

2） 在JavaScript中，最好（出于超出本文范围的原因）将开头的大括号放在同一行，而不是下一行

3） 除非您计划实例化

，否则请避免将函数大写

如果您有其他类型的输入，如text或submit按钮，您的代码将失败。首先，您必须检查是否为复选框。

if (chks[i].type=="checkbox" && chks[i].checked)

或者，如果你使用jQuery ，事情会更容易

if ($('input:checked').length < 1){
  //Nothing checked
}

函数似乎很好。你确定它被呼叫了吗？尝试使用firefox"Firebug"进行调试。打开firebug->脚本，然后在这个函数上设置断点。

为什么只在提交时检查它？我使用Mootools编写了一个函数，它在每个复选框上都被称为onchange，并选中同一div中的每个复选框。如果没有其他复选框被选中，用户就不能取消选中最后一个复选框。

<input type='checkbox' onChange='validateCheckboxes(this)' name='name' value='val' >

 function validateCheckboxes(elem){
                    var checked = elem.checked;
                    elem.getParent().getElements("input[type=checkbox]").each(function(e){checked += e.checked});
                    if(checked == 0){
                        elem.checked = 1;
                    }
                }
相关文章：