需求一个js ，原有5个隐藏的div，一个按钮，点击一次按钮显示一个div，再点一次就再显示一个
需求一个js，原有5个隐藏的div，一个按钮，点击一次按钮显示一个div，再点一次就再显示一个，再点一次就再显示一个，到最后一个div显示以后按钮消失...
需求一个js ，原有5个隐藏的div，一个按钮，点击一次按钮显示一个div，再点一次就再显示一个，再点一次就再显示一个，到最后一个div 显示以后 按钮消失
展开
2个回答
展开全部
<body>
<input type="button" id="btn" value="click" />
<div id="div1" style="width:50px; height:50px; background:red; display:none"></div>
<div id="div2" style="width:50px; height:50px; background:yellow; display:none"></div>
<div id="div3" style="width:50px; height:50px; background:#000; display:none"></div>
<div id="div4" style="width:50px; height:50px; background:#0F6; display:none"></div>
<div id="div5" style="width:50px; height:50px; background:#CF6; display:none"></div>
</body>
<script>
var oBtn = document.getElementById('btn');
var aDiv = document.getElementsByTagName('div');
var index = 0;
oBtn.onclick = function(ev){
if(aDiv[index%5].style.display == 'block'){
aDiv[index%5].style.display = 'none';
} else {
aDiv[index%5].style.display = 'block';
}
index++;
};
</script>
追问
不是我要的是 当点击第5次，也就是最后一次的时候 最后一个div显示 同时那个按钮消失
追答
<body>
<input type="button" id="btn" value="click" />
<div id="div1" style="width:50px; height:50px; background:red; display:none"></div>
<div id="div2" style="width:50px; height:50px; background:yellow; display:none"></div>
<div id="div3" style="width:50px; height:50px; background:#000; display:none"></div>
<div id="div4" style="width:50px; height:50px; background:#0F6; display:none"></div>
<div id="div5" style="width:50px; height:50px; background:#CF6; display:none"></div>
</body>
<script>
var oBtn = document.getElementById('btn');
var aDiv = document.getElementsByTagName('div');
var index = 0;
oBtn.onclick = function(ev){
if(aDiv[index%5].style.display == 'none'){
aDiv[index%5].style.display = 'block';
}
if(index%5==0){
oBtn.style.display = 'none';
}
index++;
};
</script>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
var divs=$("div").children();
var clkCount=0;
var add=true;
$('#btn').click(function(){
if (add)
divs[clkCount++].show();
else
divs[clkCount--].show();
if (clkCount=5)
add=false;
});
var clkCount=0;
var add=true;
$('#btn').click(function(){
if (add)
divs[clkCount++].show();
else
divs[clkCount--].show();
if (clkCount=5)
add=false;
});
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
