求个简便一点的js 选中单选框对应的div显示 其他消失
求个简便一点的js选中单选框对应的div显示其他消失第一组<INPUTname="checkboxN"id="checkboxN"value="1"type="radio...
求个简便一点的js 选中单选框对应的div显示 其他消失
第一组
<INPUT name="checkboxN" id="checkboxN" value="1" type="radio" onclick="dis()">
<div id="saveSearchIdd" style="display:none;">111</div>
<INPUT name="checkboxN" id="checkboxN2" value="2" type="radio" onclick="dis2()">
<div id="saveSearchIdd2" style="display:none;">2222</div>
<br><br><br><br>
第二组
<INPUT name="checkboxN2" id="checkboxN3" value="3" type="radio" onclick="dis3()">
<div id="saveSearchIdd3" style="display:none;">111</div>
<INPUT name="checkboxN2" id="checkboxN4" value="4" type="radio" onclick="dis4()">
<div id="saveSearchIdd4" style="display:none;">2222</div>
<script>
function dis()
{
var obj=document.getElementById("checkboxN");
if (obj.checked)
document.getElementById("saveSearchIdd").style.display="block";
document.getElementById("saveSearchIdd2").style.display="none";
}
function dis2()
{
var obj=document.getElementById("checkboxN2");
if (obj.checked)
document.getElementById("saveSearchIdd2").style.display="block";
document.getElementById("saveSearchIdd").style.display="none";
}
function dis3()
{
var obj=document.getElementById("checkboxN3");
if (obj.checked)
document.getElementById("saveSearchIdd3").style.display="block";
document.getElementById("saveSearchIdd4").style.display="none";
}
function dis4()
{
var obj=document.getElementById("checkboxN4");
if (obj.checked)
document.getElementById("saveSearchIdd4").style.display="block";
document.getElementById("saveSearchIdd3").style.display="none";
}
</script>
现在我每添加一组,js都要再添加一组,有没有简便一点的写法,不用再加js的。 展开
第一组
<INPUT name="checkboxN" id="checkboxN" value="1" type="radio" onclick="dis()">
<div id="saveSearchIdd" style="display:none;">111</div>
<INPUT name="checkboxN" id="checkboxN2" value="2" type="radio" onclick="dis2()">
<div id="saveSearchIdd2" style="display:none;">2222</div>
<br><br><br><br>
第二组
<INPUT name="checkboxN2" id="checkboxN3" value="3" type="radio" onclick="dis3()">
<div id="saveSearchIdd3" style="display:none;">111</div>
<INPUT name="checkboxN2" id="checkboxN4" value="4" type="radio" onclick="dis4()">
<div id="saveSearchIdd4" style="display:none;">2222</div>
<script>
function dis()
{
var obj=document.getElementById("checkboxN");
if (obj.checked)
document.getElementById("saveSearchIdd").style.display="block";
document.getElementById("saveSearchIdd2").style.display="none";
}
function dis2()
{
var obj=document.getElementById("checkboxN2");
if (obj.checked)
document.getElementById("saveSearchIdd2").style.display="block";
document.getElementById("saveSearchIdd").style.display="none";
}
function dis3()
{
var obj=document.getElementById("checkboxN3");
if (obj.checked)
document.getElementById("saveSearchIdd3").style.display="block";
document.getElementById("saveSearchIdd4").style.display="none";
}
function dis4()
{
var obj=document.getElementById("checkboxN4");
if (obj.checked)
document.getElementById("saveSearchIdd4").style.display="block";
document.getElementById("saveSearchIdd3").style.display="none";
}
</script>
现在我每添加一组,js都要再添加一组,有没有简便一点的写法,不用再加js的。 展开
2个回答
展开全部
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<script>
onload=function(){
var rs = document.querySelectorAll("input[type=radio]");
for(var i = 0;i <rs.length;i++){
(function(i){
rs[i].onclick=function(){
var cks = document.getElementsByName(this.name);
for(var j = 0;j<cks.length;j++){
cks[j].nextElementSibling.style.display="none";
}
this.nextElementSibling.style.display="block";
}
})(i);
}
}
</script>
</head>
<body>
第一组
<INPUT name="checkboxN" value="1" type="radio">
<div id="saveSearchIdd" style="display:none;">1111</div>
<INPUT name="checkboxN" value="2" type="radio">
<div id="saveSearchIdd2" style="display:none;">2222</div>
<br><br><br><br>
第二组
<INPUT name="checkboxN2" value="3" type="radio">
<div id="saveSearchIdd3" style="display:none;">1111</div>
<INPUT name="checkboxN2" value="4" type="radio">
<div id="saveSearchIdd4" style="display:none;">2222</div>
</body>
</html>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
function dis(obj)
{
var obj=document.getElementById(obj);
if (obj.checked)
document.getElementById("saveSearchIdd4").style.display="block";
document.getElementById("saveSearchIdd3").style.display="none";
}
用传参,使用时,直接dis('checkboxN');
{
var obj=document.getElementById(obj);
if (obj.checked)
document.getElementById("saveSearchIdd4").style.display="block";
document.getElementById("saveSearchIdd3").style.display="none";
}
用传参,使用时,直接dis('checkboxN');
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询