需求一个js ，原有5个隐藏的div，一个按钮，点击一次按钮显示一个div，再点一次就再显示一个

需求一个js ，原有5个隐藏的div，一个按钮，点击一次按钮显示一个div，再点一次就再显示一个，再点一次就再显示一个，到最后一个div 显示以后按钮消失

举报该文章

相关建议 æ¨èäº2016-12-05

<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>è¿½é®

è¿½ç<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>

温馨提示：内容为网友见解，仅供参考

当前网址：https://11.t2y.org/zz/f4v78v4824s24m4ffsq.html

其他看法

第1个回答 2015-10-23

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;
});

相似回答

大家正在搜