在JavaScript中,checked
属性通常用于判断一个复选框(checkbox)或单选按钮(radio button)是否被选中。checked
是一个布尔值,如果元素被选中,则值为 true
;如果未被选中,则值为 false
。
checked
属性你可以通过JavaScript来获取或设置元素的 checked
属性。以下是一些示例代码:
checked
状态// HTML
// <input type="checkbox" id="myCheckbox">
// JavaScript
const checkbox = document.getElementById('myCheckbox');
console.log(checkbox.checked); // 输出 true 或 false
checked
状态// HTML
// <input type="checkbox" id="myCheckbox">
// JavaScript
const checkbox = document.getElementById('myCheckbox');
checkbox.checked = true; // 选中复选框
checkbox.checked = false; // 取消选中复选框
你可以使用 change
事件来监听复选框的状态变化。
// HTML
// <input type="checkbox" id="myCheckbox">
// JavaScript
const checkbox = document.getElementById('myCheckbox');
checkbox.addEventListener('change', function() {
if (this.checked) {
console.log('复选框被选中');
} else {
console.log('复选框未被选中');
}
});
你可以遍历所有的复选框,并检查它们的 checked
属性。
// HTML
// <input type="checkbox" name="fruits" value="apple"> Apple
// <input type="checkbox" name="fruits" value="banana"> Banana
// <input type="checkbox" name="fruits" value="cherry"> Cherry
// JavaScript
const checkboxes = document.querySelectorAll('input[name="fruits"]');
let selectedFruits = [];
checkboxes.forEach(function(checkbox) {
if (checkbox.checked) {
selectedFruits.push(checkbox.value);
}
});
console.log(selectedFruits); // 输出被选中的水果数组
通过这些方法,你可以有效地处理和判断复选框和单选按钮的选中状态。
高校公开课
云+社区沙龙online第5期[架构演进]
云端大讲堂
原引擎 | 场景实战系列
腾讯云GAME-TECH沙龙
小程序·云开发官方直播课(数据库方向)
云+社区技术沙龙[第8期]
领取专属 10元无门槛券
手把手带您无忧上云