我有 2 列单选按钮。选择左侧的一项,对应的右侧将变为未选中,反之亦然。然后我添加了一些 Javascript,以便当前选择的单选按钮背景为蓝色,另一个为白色。这工作得很好。然后我添加了两个按钮,一个是选中左侧的所有单选按钮,另一个是选中右侧的所有单选按钮。这就是我的问题出现的地方。每当我使用按钮时,单选按钮都会被正确检查,但背景颜色永远不会正确显示。
示例 1
当我检查了第 1 列的单选按钮并且在启动时它们的背景为蓝色,然后按下按钮激活第 2 列,第 2 列的单选按钮全部被选中,其背景闪烁为蓝色片刻,然后第 1 列的背景保持蓝色。
示例 2
在启动时,我检查了第 1 列的单选按钮,但没有影响其背景颜色,然后按下按钮激活第 2 列,第 2 列的单选按钮全部被选中,其背景闪烁一会儿蓝色,然后返回白色。如果我现在单击第 1 列的按钮(收音机被选中,闪烁蓝色,返回白色),效果相同。
可能有什么问题?我想也许它可能是一个回发,但肯定无线电检查值也会刷新,所以我不认为它是。任何帮助将不胜感激。
代码
这是用于选择列的按钮。传递函数的控件只是一个 This (所以是被点击的按钮)。这有点复杂,因为单选按钮是动态创建的。要点是确定按下了哪个按钮,然后遍历相关的单选按钮并检查它们,并重新着色其父级父级(td 元素)的背景......如果这有意义的话。
function ColumnBtnSelect(control) {
var btnNum = (control.id).substring((control.id).length - 1, (control.id).length);
var objPart = "ctl00_ContentPlaceHolder1_GridView1_ctl";
var objName;
for (x = 3; x <= 15; x++) {
if (btnNum == 1) {
var num1 = "0" + x;
objName = objPart + num1.substr(num1.length - 2) + "_" + ((x - 3) * 2);
document.getElementById(objName).checked = true;
$(document.getElementById(objName)).parent().parent().css("background-
color", "#A9D0F5");
}
else {
var num1 = "0" + x;
objName = objPart + num1.substr(num1.length - 2) + "_" + (((x - 3) * 2) + 1);
document.getElementById(objName).checked = true;
$(document.getElementById(objName)).parent().parent().css("background-
color", "#A9D0F5");
}
}
更新
在阅读了您的建议后,我回顾了我的代码。我有另一个 javascript 函数将相应的单选按钮设置为白色,但是自从我尝试了示例 2 之后,我已经将其注释掉了,这意味着我现在在代码中没有任何地方将任何内容设置为白色,但即使行似乎仍在切换暂时变为蓝色,然后变回白色。很奇怪。我还在 Firebug 中检查了我的 CSS。所有的 td 元素(应该是蓝色但实际上是白色的)似乎没有列出背景颜色的任何设置,既不是白色也不是蓝色。这看起来好像它没有被覆盖,但可能会返回默认值?不管怎样,我都难住了!