0

我有 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 元素(应该是蓝色但实际上是白色的)似乎没有列出背景颜色的任何设置,既不是白色也不是蓝色。这看起来好像它没有被覆盖,但可能会返回默认值?不管怎样,我都难住了!

4

2 回答 2

1

您发布的代码将所选单选按钮的背景更改为蓝色。但它不会将未选中的单选按钮的背景颜色更改为白色。(意味着其他一些代码正在这样做)

您发布的代码看起来不错。它将所选单选按钮的背景颜色更改为蓝色。所以问题可能出在当单选按钮被取消选中时将背景颜色变为白色的代码。

您究竟是如何将背景颜色更改为白色的?您应该查看该代码或在此处发布该代码以获得更多帮助:D

于 2012-08-22T18:36:00.300 回答
0

正如我所怀疑的那样,我的按钮有问题导致回发。奇怪的是复选框没有重置,但是一旦我确定没有回发,就像一个魅力!

于 2012-08-28T11:56:02.987 回答