时间戳

首页 > 解决方案 > （原版）JS：复选框“选中”返回意外结果

javascript - （原版）JS：复选框“选中”返回意外结果

问题描述

使用下面的笔，您可以看到有两个元素，一个按钮和一个复选框输入。

单击按钮时，我想确定复选框的状态（单击/未单击）。

无论是否存在视觉复选标记，控制台始终会记录false. 为什么是这样？

https://codepen.io/sterlingbutters/pen/ZEGGgvm

编辑（代码）：

HTML：

<input id='stall' type="checkbox">

<button id='button'>Test

JS：

var stall = document.getElementById('stall').checked;
var button = document.getElementById('button');
button.onclick = function () {
  console.log(stall);
}

标签： javascripthtmlcheckbox

解决方案

试试这个：将元素分配给变量，然后在你的 onclick 函数中，checked每次运行时你都会获得该属性。

如果您只是将布尔值存储checked在变量中，它将永远不会更新。像布尔值这样的原始类型总是存储为简单的值，而不是作为自动更新对原始属性的引用。

var stall = document.getElementById('stall');
var button = document.getElementById('button');
button.onclick = function () {
  console.log(stall.checked);
}
<input id='stall' type="checkbox">

<button id='button'>Test

推荐阅读