以下是一个示例代码,演示如何使用JavaScript来实现“不要为不同的ID选择多个单选按钮”的解决方法:
HTML部分:
JavaScript部分:
const radioButtons = document.querySelectorAll('input[type="radio"]');
radioButtons.forEach(button => {
button.addEventListener('click', () => {
// 获取当前选中的单选按钮的ID和name属性
const currentId = button.id;
const currentName = button.name;
// 根据name属性获取同组的所有单选按钮
const groupButtons = document.querySelectorAll(`input[type="radio"][name="${currentName}"]`);
// 遍历同组的所有单选按钮
groupButtons.forEach(groupButton => {
// 排除当前选中的单选按钮,将其checked属性设置为false
if (groupButton.id !== currentId) {
groupButton.checked = false;
}
});
});
});
上述代码通过给每个单选按钮添加一个点击事件监听器,在点击时获取当前选中的单选按钮的ID和name属性。然后,根据name属性获取同组的所有单选按钮,并遍历这些按钮。在遍历过程中,将除了当前选中的单选按钮外的其他单选按钮的checked属性设置为false,以确保不会为不同的ID选择多个单选按钮。
下一篇:不要为单个函数记录警告。