时间戳

首页 > 解决方案 > 如何使用单选按钮更改 a 的颜色？

javascript - 如何使用单选按钮更改 a 的颜色？

问题描述

如何<td>根据单选按钮的值更改元素的颜色？如果单选按钮选中“否”，我想设置<td bgcolor></td>为红色，如果单选按钮选中“确定”，我想设置为绿色。

function color(){
  if(radio1.checked()){
    td1.bgcolor="green";
  }
  if(radio2.checked()){
    td1.bgcolor="red";
  }
}

<table>
  <tr>
    <td bgcolor="#B35556">
      <form action="">
        OK <input type="radio" name="radio1" id="radio1"value="OK" checked="color()"/> <BR>
        NO  <input type="radio" name="radio2" id="radio2"value="NO"/>                
      </form>
    </td>
  </tr>
</table>

我知道这段代码非常错误，但这是一个让你理解我的问题的例子

标签： javascriptjqueryhtmlradio-button

解决方案

几点：

  1. 使用 name 属性将单选按钮定义为同一组的一部分（具有相同名称的单选按钮属于同一组）。

  2. 将该函数附加到onchage两个单选按钮的事件上。

  3. 您必须使用元素的style属性来设置backgroundColor.

试试下面的方法：

function color(el){
  if(el.value=="OK"){
    el.parentNode.parentNode.style.backgroundColor="green";
  }
  else{
    el.parentNode.parentNode.style.backgroundColor="red";
  }
 }
<table>
  <tr>
    <td bgcolor="#B35556">
      <form action="">

        OK <input type="radio" name="radio" id="radio1"value="OK" onchange="color(this)"/> <BR>
        NO <input type="radio" name="radio" id="radio2"value="NO" onchange="color(this)" checked/>

      </form>
    </td>
  </tr>
</table>

推荐阅读