确定不再选择单选按钮

时间:2014-10-05 09:00:05

标签: javascript html

当我在表单中选择一个单选按钮(由onchange事件调用)时,我写了一个javascript函数来改变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事件不会触发此选项。有没有办法确定不再检查单选按钮?

3 个答案:

答案 0 :(得分:0)

如果我理解你想要达到的目的,只需阅读document.getElementById("myRadio").checked - 这将是真是假

答案 1 :(得分:0)

好吧,如果我理解正确,你有一个函数,当你检查一个单选按钮时应用一些样式,但你也想从元素中删除样式,这对应于已经未经检查的按钮。如果是,您可以将先前检查的项目存储在变量中,然后您可能需要以下内容:

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;
}

答案 2 :(得分:0)

您必须清除以前分配的课程。看一下这个例子:

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/