javascript控制点击后加个css进去

javascript控制点击后加个css进去

jquery比较简单，javascript方法比较冗余一点。。
<div><label id="1" class="local"><input name="1" type="radio" value="1" onclick="addClass(1)"></label><label id="2" class="local"><input name="1" type="radio" value="2" onclick="addClass(2)"></label><label id="3" class="local"><input name="1" type="radio" value="3" onclick="addClass(3)"></label></div><script>function addClass(str){switch(str){case 1:document.getElementById("1").className="local ach";document.getElementById("2").className="local";document.getElementById("3").className="local";break;case 2:document.getElementById("1").className="local";document.getElementById("2").className="local ach";document.getElementById("3").className="local";break;case 3:document.getElementById("1").className="local";document.getElementById("2").className="local";document.getElementById("3").className="local ach";break;default:document.getElementById("1").className="local";document.getElementById("2").className="local";document.getElementById("3").className="local";break;}}</script>2016-10-26

处理radio的onclick事件，在事件处理函数中使用对象的className来修改class的值。代码类似:
HTML:

<input name="1" type="radio" value="1" onclick="onRadioClk(this);" />
JavaScript:
var g_preObj;

function onRadioClk(radioObj) {
if (g_preObj != null) {
g_preObj.parent.className = "local";

}
radioObj.parent.className = "local ach";
g_preObj = radioObj;

}

不过，class名称中有空格好像不符合命名规则吧。2016-10-26

需要先引用jquery的库，这些代码你试试，希望可以帮到你
$(document).ready(function(){
$("input[type='radio']").click(function(){
if($(this).prop("checked")==true){
$(this).parent().addClass("ach").siblings().removeClass("ach");
}
})

})2016-10-26