Question

我正在尝试检查复选框是否已选中。我有更多的输入，他们有不同的名字。我设法选择输入，但我似乎无法检查它是否被选中。如果我添加条件'= true'，我会在加载页面后检查它。如果我离开它。检查它什么都不做

我选择了正确的输入吗？请注意我想通过名称而不是ID或类
为什么一旦页面加载我的条件if语句不起作用？

<input type="checkbox" name="name1">
<input type="checkbox" name="name2">
<input type="checkbox" name="name3">
<input type="checkbox" name="name4">


const firstInput = document.getElementsByName('name1');
if (firstInput[0].checked) {
    console.log('checked');
}

Answer 1

您正在选择名称为“1”的元素，但不要使用具有此名称的元素。如果要选择name属性以“name”开头的所有输入：

const firstInput = document.querySelectorAll('[name^=name]')

Answer 2

您需要为该输入添加属性。附加一个onclick监听器并调用

的getAttribute 的setAttribute

操纵'已检查'属性;

<input type="checkbox" onclick="myFunction()" name="name1">
<input type="checkbox" onclick="myFunction()" name="name2">
<input type="checkbox" onclick="myFunction()" name="name3">
<input type="checkbox" onclick="myFunction()" name="name4">


function myFunction() {
  var $element = document.getElementsByName('name1')[0];
  var checked = $element.getAttribute('checked') === 'true';
  $element.setAttribute('checked', !checked);
  console.log($element.getAttribute('checked'));
}

按名称选中复选框，然后检查是否已选中javascript

2 个答案: