用jquery获取radio选中的事件(根据type="radio"是否为checked,来展示不同内容)
程序员文章站
2022-06-16 08:18:02
...
1.引入jquery文件:<script src="https://code.jquery.com/jquery-3.3.1.js"></script> （src下写好对应的路径）
2.举个栗子:
body中内容:
<body>
<form>
<label>请选择:</label>
<input type="radio" id="price_one" name="price_type" checked>内容1
<input type="radio" id="price_two" name="price_type"> 内容2
</form>
<div>
<div id="content_one" style="display:block">这是要展示的内容1</div>
<div id="content_two" style="display:none">这是要展示的内容2</div>
</div>
</body>js中
<script type="text/javascript">
$("input[name=price_type]").click(function(){
showCont()
})
function showCont(){
switch($("input[name=price_type]:checked").attr("id")){
case "price_one" :
$("#content_one").show()
$("#content_two").hide()
break;
case "price_two":
$("#content_one").hide()
$("#content_two").show()
break;
default:break;
}
}
</script>
简单记录一下 方便后期使用。https://code.jquery.com/jquery-3.3.1.js这个是jquery的官方网址。