Question

这是我的单选按钮：

<label>
  <input type="radio" id="chk1" name="chooseSupp" onclick="change(this);">
    Chosen Supplier
</label>

这是我的Javascript突出显示单元格：

<script type="text/javascript">
  function change(obj) {
    var tr=obj.parentNode.parentNode;
    tr.style.backgroundColor=(obj.checked)? 'red' : 'transparent';
  }
</script>

问题是，当我点击一个单选按钮时，它突出显示没问题，但是当我点击另一个单选按钮时，它也会突出显示，但第一个按钮上的突出显示不会消失。

我的单选按钮处于循环中，不确定这是否与任何可能的解决方案相关。

有什么想法吗？

Answer 1

    function change(obj) {
      var tr=obj.parentNode.parentNode.parentNode;
      var tbl = tr.parentNode;
      var inputs = tbl.getElementsByTagName("input");
      for(var i = 0;i<inputs.length;i++)
          inputs[i].parentNode.parentNode.parentNode.style.backgroundColor='transparent';
      tr.style.backgroundColor=(obj.checked)? 'red' : 'transparent';
    }

首先使所有其他输入透明。然后将你的风格应用到新风格。

您也可以检查是否检查了其他输入，就像您对当前输入所做的那样。如果你使用复选框，这将是有用的。

与JS的高地单选按钮

1 个答案: