css的设置没有起作用？

Question

hobby:<input id="x1" type="radio" name="sports" />x1
<input id="x2" type="radio" name="sports" />x2
<input id="x3" type="radio" name="sports" />x3
<input type="button" value="显示" onclick="ShowChecked()">
<br>
<script> 
function ShowChecked(){
    $("input").css("backgroundColor","");
    $("input:checked").css("backgroundColor","red");
}    
</script>

选择某个radio后，点击 显示 ，背景颜色没有变红哈？

Answer 1

选择器没问题，问题出现在input[type=radio]的背景显示不了，或者说设置不了背景

你可以设置一下margin试试

function ShowChecked(){
    $("input").css("backgroundColor","");
    $("input:checked").css("margin","100px");
}    

Answer 2

<input type="button" value="显示" onclick="ShowChecked">

Answer 3

你的代码是没有问题的，你可以F12看一下，加的css属性已经加上去了，之所以没有出现效果(bakground变红)是因为，input radio设置background没有效果。如果你要设置单选框的效果，你应该用input和label标签结合起来，才能设置更好看的单选或者多选按钮。