Question

我正在尝试将类“ 流” 添加到当前选中的电台选项中。我可以使用

onClick="document.getElementById( volunteering ).class +=  current ;"

然而, 这确实会添加类, 但是当您选择另一个收音机按钮时它会粘贴( 因为每个按钮都有它) 。对于如何在所有收音机按钮中执行它有什么想法吗?

我使用的代码如下:

<form> 
<ul>
    <input type="radio" name="category" id="volunteering" value="volunteering"><li class="conversation">
   <a href="#" onClick="document.getElementById( volunteering ).checked = true;" >Volunteering</a>
 </li>
 <input type="radio" name="category" value="cityproblems" id="cityproblems"><li class="conversation">
   <a href="#" onClick="document.getElementById( cityproblems ).checked = true;" >City Problems</a>
  </li>
 <input type="radio" name="category" value="safety" id="safety"><li class="conversation">
    <a href="#" onClick="document.getElementById( safety ).checked = true;" class="">Safety</a>
 </li>
</form>

Answer 1

您需要首先从所有无线电按钮中删除该类, 然后将其添加到单击的按钮中。定义一个函数, 通过接收 ID 作为参数来做到这一点, 并将该函数绑到 < code> on kick 上。

function selectRadioClass(radioId) {
  // Note - there are more clever ways, like arrays and loops
  // for this, but if it s only 3, this is fine
  document.getElementById( volunteering ).className =   ;
  document.getElementById( cityproblems ).className =   ;
  document.getElementById( safety ).className =   ;

  // Then add it back to the node passed in by id
  document.getElementById(radioId).className =  current ;
  // And check the button
  document.getElementById(radioId).checked = true;
}

然后用以下方式绑定每个收听按钮 s on kick :

<a href="#" onClick="selectRadioClass( safety );" class="">Safety</a>

Answer 2

有两种解决办法:

使用 CSS3 : checked 选择器

 form input:checked {
   /* your style rules here. */
   /* No more scripting needed. */
 }

http://www.quirksmode.org/css/pacted.html

<强>为此目的使用一个全球函数。

检查迈克尔的解决方案

Answer 3

使用 CSS 伪选择器, 并忘记 JavaScript 。 < code> 元素有一个: checked 。

http://css-tricks.com/pseudo-level-selectors/" rel="nown" >http://css-tricks.com/pseudo-level-selectors/

友情链接