Question

我有一个简单的checkbox，我正在尝试确定它是否在JS中被检查过。

var checkbox = document.getElementById('checkbox').checked;
console.log(checkbox);
if(checkbox == 'true'){
    console.log('test');
}

我的第一个console.log()按预期返回true或false，但即使它if()声明，它也永远不会进入true声明。< / p>

我不确定我错过了什么？对此有任何帮助或帮助将不胜感激。

Answer 1

要检查是否选中了复选框，请不要对"true"（字符串）进行测试。相反，您检查其checked属性以查看它是否为true（布尔值）。这变得更容易处理，因为if条件总是首先测试“truthy”值，所以你真的不需要添加你正在测试true。

var checkbox = document.getElementById('checkbox').checked;
// Interpreted as "Is it true that checkbox.checked == true"?
if(checkbox.checked == true){
    console.log('test');
}

var checkbox = document.getElementById('checkbox').checked;
// Interpreted as "Is checkbox.checked true"?
if(checkbox.checked){
    console.log('test');
}

但是，无需检查是否选中了复选框。只查询文档以查看选中的复选框，返回的内容就是您使用的内容。

.querySelector() 和 .querySelectorAll() 允许您将任何有效的CSS选择器传递给它们。 .querySelector()将返回与选择器匹配的第一个元素，.querySelectorAll()将返回所有匹配元素的节点列表（HTML Collection）。

document.querySelector("button").addEventListener("click", function(){
  // Query for only the checked checkboxes and put the result in an array
  let checked = Array.prototype.slice.call(document.querySelectorAll("input[type='checkbox']:checked"));
  console.clear();
  // Loop over the array and inspect contents
  checked.forEach(function(cb){
    console.log(cb.value);
  });
});

<input type="checkbox" value="one"> One 
<input type="checkbox" value="two"> Two 
<input type="checkbox" value="three"> Three 
<input type="checkbox" value="four"> Four

<button>Get Checked Checkboxes</button>

Answer 2

让我们看看你的代码：

var checkbox = document.getElementById('checkbox').checked;
console.log(checkbox);
if(checkbox == 'true'){
    console.log('test');
}

您将复选框名称赋予包含布尔值

的变量

更改为

var checkbox = document.getElementById('checkbox');

您正在将布尔值与字符串

进行比较

true == 'true'

总是false。改为

if (checkbox.checked) {
    console.log('test');
}

您使用的是复选框

的ID

您可能有几个具有相同id的复选框。如果是这种情况，请将其更改为class并使用

document.getElementsByClassName

代替。你将得到一个数组，你将不得不循环迭代它。

Answer 3

条件必须等于true没有引号，否则它与字符串比较。

Answer 4

您正在尝试将布尔值与字符串进行比较。你想要的是根据需要比较bool和bool。

var checkbox = document.getElementById('checkbox').checked;
console.log(checkbox);
if(checkbox == true){
    console.log('test');
}

Answer 5

您正在尝试检查布尔变量是否等于字符串“true” 请检查

if(checkbox) {...}

Answer 6

从true附近删除引号。

if(checkbox === true){
    console.log('test');
}

更好（更简洁）：

if(checkbox){
    console.log('test');
}

Answer 7

true和'true'不一样。尝试console.log(true == 'true')，它会给false，因为第一个是bolean值（true或false），而第二个是字符串值（'any kind of text'）。

所以要正确检查bolean你应该这样做：

var checkbox = document.getElementById('checkbox').checked;
console.log(checkbox);
if(checkbox == true){
    console.log('The checkbox is true');
}

甚至你可以这样做：

var checkbox = document.getElementById('checkbox').checked;
console.log(checkbox);
if(checkbox){
    console.log('The checkbox is true');
}

因为checkbox已经是一个bolean，它将与if()语句一起使用。这就像在执行true == true（即true）和false == true（即false）一样，您正在执行冗余代码。

Answer 8

请在IF情况下删除单引号为true。如果你添加引号，它会将它作为一个字符串。

试试这个：

if（checkbox == true）{ ... }

这应该有用。

Answer 9

我不确定发生了什么，但当我if(checkbox == true)时，我收到的信息是true is not defined，好像它正在寻找一个名为true的变量。

我将其更改为使用Jquery，如if($("#checkbox").is(':checked'))

如果复选框已选中条件Javascript

9 个答案:

您将复选框名称赋予包含布尔值

您正在将布尔值与字符串

您使用的是复选框