Javascript 选中所有复选框,然后将类添加到某个对象
我需要在选中所有输入复选框后向元素添加一个类,而无需单击提交按钮。我更希望不涉及jQuery,因为这将是页面上唯一的javascript元素。这是我到目前为止所做的,看起来它是在第一次单击复选框后添加类,这不是我想要的 JSJavascript 选中所有复选框,然后将类添加到某个对象,javascript,forms,checkbox,Javascript,Forms,Checkbox,我需要在选中所有输入复选框后向元素添加一个类,而无需单击提交按钮。我更希望不涉及jQuery,因为这将是页面上唯一的javascript元素。这是我到目前为止所做的,看起来它是在第一次单击复选框后添加类,这不是我想要的 JS function showMe (box) { var checkbox = document.getElementsByName("selectPlant"); for(var i=0;i<checkbox.length;i++) { if(che
function showMe (box) {
var checkbox = document.getElementsByName("selectPlant");
for(var i=0;i<checkbox.length;i++) {
if(checkbox[i].checked){
document.getElementById(box).classList.add('show');
}
}
}
#reward {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: red;
color: white;
pointer-events: none;
}
#reward.show {
opacity: 1 !important;
}
input[type=checkbox] {
width: 40px;
height: 40px;
}
任何帮助都会很棒 如果勾选了某个复选框,则需要获取复选框的总数并增加计数器。如果数字匹配,则必须勾选所有复选框
function showMe (box) {
var checkbox = document.getElementsByName("selectPlant");
var counter=0;
for(var i=0;i<checkbox.length;i++) {
if(checkbox[i].checked){
counter++;
}
if(counter==checkbox.length)
{
document.getElementById(box).classList.add('show');
}
}
}
函数showMe(框){
var checkbox=document.getElementsByName(“selectPlant”);
var计数器=0;
对于(var i=0;i您可以添加长度变量复选框,并将i与长度进行比较
var length = checkbox.length;
var check = 0;
for(var i=0;i<checkbox.length;i++) {
if(checkbox[i].checked){
check++;
}
if (check == length){
document.getElementById(box).classList.add('show');
}
}
除了正常行为外,如果不存在复选框,此答案将默认为true
function showMe (box) {
var checkbox = document.getElementsByName("selectPlant");
var allChecked=true;
for(var i=0;i<checkbox.length;i++) {
if(!checkbox[i].checked){
allChecked = false;
}
}
if(allChecked){
document.getElementById(box).classList.add('show');
}
}
函数showMe(框){
var checkbox=document.getElementsByName(“selectPlant”);
var allChecked=true;
对于(var i=0;i
function showMe (box) {
var checkbox = document.getElementsByName("selectPlant");
var allChecked=true;
for(var i=0;i<checkbox.length;i++) {
if(!checkbox[i].checked){
allChecked = false;
}
}
if(allChecked){
document.getElementById(box).classList.add('show');
}
}