单击时如何更改单选按钮的CSS

Question

<style type="text/css">
.radiostyle {
    background-color: #999;
}
</style>

<label for="a1" class="radiostyle">
<Input type = radio Name = 1 Value = 100 Onclick="changecss()" id="a1">
100 bucks</label>

函数changecss()的代码是什么,这样当单击单选按钮时,无线电背景会变为其他颜色,例如绿色.请帮忙,我在网上找了几个小时没有解决方案.

Answer 1

您可以使用only-CSS解决方案(CSS3):

HTML:

<input type="radio" name="1" value="100" id="a1">
<label for="a1" class="radiostyle">100 bucks</label>

CSS:

.radiostyle {
    background-color: #999;
}
input[type=radio]:checked+label {
/* Or `#a1:checked+label` if you only want it for that input */
    background-color: red;
}

http://jsfiddle.net/peSJG/