确保至少选中一个复选框
我有一个具有多个复选框的表单，我希望使用JavaScript确保至少选中一个复选框。这就是我现在所拥有的，但无论选择什么，都会弹出一个警告。
JS (错误)
function valthis(){
if (document.FC.c1.checked) {
alert ("thank you for checking a checkbox")
} else {
alert ("please check a checkbox")
}
}HTML
<p>Please select at least one Checkbox</p>
<br>
<br>
<form name = "FC">
<input type = "checkbox" name = "c1" value = "c1"/> C1
<br>
<input type = "checkbox" name = "c1" value = "c2"/> C2
<br>
<input type = "checkbox" name = "c1" value = "c3"/> C3
<br>
<input type = "checkbox" name = "c1" value = "c4"/> C4
<br>
</form>
<br>
<br>
<input type = "button" value = "Edit and Report" onClick = "valthisform();">所以我最终在JS中做的是：
：
function valthisform(){
var chkd = document.FC.c1.checked || document.FC.c2.checked||document.FC.c3.checked|| document.FC.c4.checked
if (chkd == true){
} else {
alert ("please check a checkbox")
}
}我决定去掉“谢谢”这一部分，以适应剩下的任务。非常感谢，每个人的建议真的很有帮助。
回答 8
Stack Overflow用户
发布于 2012-08-03 08:40:54
如果您打算引用两个复选框(如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的数组。
Stack Overflow用户
发布于 2020-01-02 05:00:20
我会选择一种更实用的方法。自从ES6以来，我们已经有了这么好的工具来解决我们的问题，所以为什么不使用它们呢？让我们首先给复选框一个类，这样我们就可以很好地将它们四舍五入。我更喜欢使用类而不是inputtype="checkbox“，因为现在的解决方案更加通用，并且当您的文档中有更多组的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，则缩减程序将返回true。上一次迭代的返回值是当前迭代的累加器，因此，如果它为真，它将一直保持为真直到结束。
Stack Overflow用户
发布于 2012-08-03 09:19:34
您不能通过表单输入的名称访问表单输入。请改用document.getElements方法。
https://stackoverflow.com/questions/11787665
复制相似问题
腾讯云开发者
