jquery 获取radio选中的value值,并实现切换效果
直接上代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
.test2 .box{
padding: 50px 0;
}
.test2 .box1{
background: red;
}
.test2 .box2{
background: green;
}
</style>
</head>
<body>
<form action="">
<div class="test2">
<div class="box1 box">内容1</div>
<div class="box2 box" style="display: none;">内容2</div>
<div class="radiobox">
<input type="radio" name="items2" value="0" checked="checked">展示内容1
<input type="radio" name="items2" value="1">展示内容2
</div>
</div>
</form>
<script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
<script type="text/javascript">
$(function() {
$("input[name='items2']").click(function() {
console.log($(this).val())
if ($(this).attr("checked")) {
$(".box1").show()
$(".box2").hide();
} else {
$(".box2").show()
$(".box1").hide();
}
});
})
</script>
</body>
</html>
效果