确定不再选择单选按钮

Determine radio button not selected anymore

本文关键字：单选按钮 选择 不再      更新时间：2023-09-26

我编写了一个javascript函数，当我选择表单中的单选按钮（由onchange事件调用）时，它会更改div（这里是TR标记）的样式。

function handleCheck(myRadio) {
    var vak = 'vak' + myRadio.name + 'x' + myRadio.value;
    var col = document.getElementById(vak);
    col.style.backgroundColor = "black"; 
    col.style.color = "white"; 
}

但是，当您选择选项X时，通常会取消选择另一个选项，而您在同一时间只能选择一个值。此选项不是由onchange事件触发的。有没有办法确定单选按钮不再被选中？

您必须清除以前分配的类。看看这个例子：

function handleCheck(myRadio) {
    clear(myRadio.className);
    var vak = 'vak' + myRadio.name + 'x' + myRadio.value;
    var col = document.getElementById(vak);
    col.className += ' selected'; 
}
function clear(className) {
    var tr = document.querySelectorAll('tr.vak' + className);
    for (var i = 0; i < tr.length; i++) {
        tr[i].className = 'vak' + className;
    }
}

演示：http://jsfiddle.net/abh7guv5/

如果我正确理解了您想要实现的目标，只需阅读document.getElementById("myRadio").checked即可-为真或假

好吧，如果我理解正确的话，您有一个函数，每当您选中单选按钮时，它都会应用一些样式，但您也希望从元素中删除与已经取消选中的按钮相对应的样式。如果是的话，你可以将你以前检查过的项目存储在一个变量中，那么你可能想要这样的东西：

var previousElement = null;
function handleCheck(myRadio) {
   var vak = 'vak' + myRadio.name + 'x' + myRadio.value;
   var col = document.getElementById(vak);
   col.style.backgroundColor = "black"; 
   col.style.color = "white";
   if(previousElement!==null&&previousElement!==col){
       previousElement.style.color = ""; // or whatever you want
   }
   previousElement = col;
}
相关文章：