确保至少选中一个复选框

如果您计划像document.FC.c1那样引用两个名称相同的复选框，则应避免它们。如果你有多个名为c1的复选框，浏览器如何知道你指的是哪个？

这里有一个非jQuery解决方案，用于检查页面上是否有复选框被选中。

var checkboxes = document.querySelectorAll('input[type="checkbox"]');
var checkedOne = Array.prototype.slice.call(checkboxes).some(x => x.checked);

您需要Array.prototype.slice.call部分来将document.querySelectorAll返回的NodeList转换为一个可以在上调用some的数组。

这应该有效：

function valthisform()
{
    var checkboxs=document.getElementsByName("c1");
    var okay=false;
    for(var i=0,l=checkboxs.length;i<l;i++)
    {
        if(checkboxs[i].checked)
        {
            okay=true;
            break;
        }
    }
    if(okay)alert("Thank you for checking a checkbox");
    else alert("Please check a checkbox");
}

如果您对代码有任何疑问，请发表评论。

^{我使用l=checkboxs.length来提高性能。看见http://www.erichynds.com/javascript/javascript-loop-performance-caching-the-length-property-of-an-array/}

我会选择更实用的方法。自从ES6以来，我们已经得到了很好的工具来解决我们的问题，为什么不使用它们呢。让我们从给复选框上课开始，这样我们就可以很好地将它们四舍五入。我更喜欢使用类而不是输入[type="checkbox"]，因为现在该解决方案更通用，当文档中有更多的复选框组时也可以使用。

HTML

    <input type="checkbox" class="checkbox" value=ck1 /> ck1<br />
    <input type="checkbox" class="checkbox" value=ck2 /> ck2<br />

JavaScript

function atLeastOneCheckboxIsChecked(){
    const checkboxes = Array.from(document.querySelectorAll(".checkbox"));
    return checkboxes.reduce((acc, curr) => acc || curr.checked, false);
}

调用时，如果未选中复选框，则函数将返回false，如果其中一个或两个都选中，则函数返回true。

它的工作原理如下，reducer函数有两个参数，累加器（acc）和当前值（curr）。对于数组上的每次迭代，如果累加器或当前值为true，则reducer将返回true。上一次迭代的返回值是当前迭代的累加器，因此，如果它为真，那么它将一直保持为真，直到结束。

检查此项。

您无法通过表单输入的名称访问表单输入。请改用document.getElements方法。

香草JS:

var checkboxes = document.getElementsByClassName('activityCheckbox'); // puts all your checkboxes in a variable
function activitiesReset() {
    var checkboxesChecked = function () { // if a checkbox is checked, function ends and returns true. If all checkboxes have been iterated through (which means they are all unchecked), returns false.
        for (var i = 0; i < checkboxes.length; i++) {
            if (checkboxes[i].checked) {
                return true;
            }
        }
        return false;
    }
    error[2].style.display = 'none'; // an array item specific to my project - it's a red label which says 'Please check a checkbox!'. Here its display is set to none, so the initial non-error label is visible instead. 
        if (submitCounter > 0 && checkboxesChecked() === false) { // if a form submit has been attempted, and if all checkboxes are unchecked
            error[2].style.display = 'block'; // red error label is now visible.
        }
}
for (var i=0; i<checkboxes.length; i++) {  // whenever a checkbox is checked or unchecked, activitiesReset runs.
    checkboxes[i].addEventListener('change', activitiesReset);
}

解释：
一旦尝试提交表单，这将更新您的复选框部分的标签，以通知用户在尚未选中复选框的情况下选中复选框。如果未选中复选框，则会显示一个隐藏的"错误"标签，提示用户"请选中复选框！"。如果用户选中至少一个复选框，则红色标签会立即再次隐藏，从而显示原始标签。如果用户再次取消选中所有复选框，则会实时返回红色标签。这是通过JavaScript的onchange事件（写为.addEventListener('change', function(){});

您可以使用这个简单的代码来检查是否选中了至少一个复选框。你也可以放下你的信息。

参考链路

<label class="control-label col-sm-4">Check Box 2</label>
    <input type="checkbox" name="checkbox2" id="checkbox2" value=ck1 /> ck1<br />
    <input type="checkbox" name="checkbox2" id="checkbox2" value=ck2 /> ck2<br />
<script>
function checkFormData() {
    if (!$('input[name=checkbox2]:checked').length > 0) {
        document.getElementById("errMessage").innerHTML = "Check Box 2 can not be null";
        return false;
    }
    alert("Success");
    return true;
}
</script>

< script type = "text/javascript" src = "js/jquery-1.6.4.min.js" >  <  / script >
     < script type = "text/javascript" >
function checkSelectedAtleastOne(clsName) {
    if (selectedValue == "select")
        return false;
    var i = 0;
    $("." + clsName).each(function () {
        if ($(this).is(':checked')) {
            i = 1;
        }
    });
    if (i == 0) {
        alert("Please select atleast one users");
        return false;
    } else if (i == 1) {
        return true;
    }
    return true;
}
$(document).ready(function () {
    $('#chkSearchAll').click(function () {
        var checked = $(this).is(':checked');
        $('.clsChkSearch').each(function () {
            var checkBox = $(this);
            if (checked) {
                checkBox.prop('checked', true);
            } else {
                checkBox.prop('checked', false);
            }
        });
    });
    //for select and deselect 'select all' check box when clicking individual check boxes
    $(".clsChkSearch").click(function () {
        var i = 0;
        $(".clsChkSearch").each(function () {
            if ($(this).is(':checked')) {}
            else {
                i = 1; //unchecked
            }
        });
        if (i == 0) {
            $("#chkSearchAll").attr("checked", true)
        } else if (i == 1) {
            $("#chkSearchAll").attr("checked", false)
        }
    });
});
<  / script >

防止用户取消选中上次选中的复选框
jQuery（原始答案）。

$('input[type="checkbox"][name="chkBx"]').on('change',function(){
    var getArrVal = $('input[type="checkbox"][name="chkBx"]:checked').map(function(){
        return this.value;
    }).toArray();
    if(getArrVal.length){
        //execute the code
        $('#msg').html(getArrVal.toString());
    } else {
        $(this).prop("checked",true);
        $('#msg').html("At least one value must be checked!");
        return false;
    }
});

更新答案2019-05-31
普通JS

let i,
    el = document.querySelectorAll('input[type="checkbox"][name="chkBx"]'),
    msg = document.getElementById('msg'),
    onChange = function(ev){
        ev.preventDefault();
        let _this = this,
            arrVal = Array.prototype.slice.call(
                document.querySelectorAll('input[type="checkbox"][name="chkBx"]:checked'))
                    .map(function(cur){return cur.value});
        if(arrVal.length){
            msg.innerHTML = JSON.stringify(arrVal);
        } else {
            _this.checked=true;
            msg.innerHTML = "At least one value must be checked!";
        }
    };
for(i=el.length;i--;){el[i].addEventListener('change',onChange,false);}

<label><input type="checkbox" name="chkBx" value="value1" checked> Value1</label>
<label><input type="checkbox" name="chkBx" value="value2"> Value2</label>
<label><input type="checkbox" name="chkBx" value="value3"> Value3</label>
<div id="msg"></div>

$('input:checkbox[type=checkbox]').on('change',function(){
    if($('input:checkbox[type=checkbox]').is(":checked") == true){
        $('.removedisable').removeClass('disabled');    
    }else{
        $('.removedisable').addClass('disabled');   
    });