为什么JavaScript属性不自动更新？
提问于 2021-10-26 17:39:51
我有一个对象，其属性存储checkbox的checked属性，如下所示：
var x = {
isChecked: document.querySelector("input").checked
};
function getX() {
(x.isChecked ? console.log("checkbox is checked") : console.log("checkbox is not checked"));
}<input type="checkbox">
<button onclick="getX()">is the checkbox checked?</button>
选中和取消选中该复选框时，isChecked属性的值不会更新。为什么会这样呢？
回答 1
Stack Overflow用户
回答已采纳
发布于 2021-10-26 17:43:26
因为.checked是一个布尔值，而不是一个对象，所以当您说isChecked: document.querySelector("input").checked时，您只是将isChecked设置为element.checked的当前值。使isChecked成为一个函数，以便在每次需要时获取实际值。
var x = {
isChecked: () => document.querySelector("input").checked
};
function getX() {
(x.isChecked() ? console.log("checkbox is checked") : console.log("checkbox is not checked"));
}<input type="checkbox">
<button onclick="getX()">is the checkbox checked?</button>
或者，如果您希望继续在isChecked而不是isChecked()中使用它，并且希望能够使用该变量手动设置它，则可以像这样使用getters和setters：
var x = {
get isChecked() {
return document.querySelector("input").checked;
},
set isChecked(checked) {
return document.querySelector("input").checked = checked;
}
};
function getX() {
(x.isChecked ? console.log("checkbox is checked") : console.log("checkbox is not checked"));
}<input type="checkbox">
<button onclick="getX()">is the checkbox checked?</button>
<button onclick="x.isChecked = false">uncheck</button>
<button onclick="x.isChecked = true">check</button>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/69731772
复制
腾讯云开发者
