Question

好。所以我做了按钮，显示了另外四个项目（div）。有人可以帮我如何切换这个按钮吗？我想通过在同一个按钮上第二次单击来隐藏这四个项目。这是代码：

<script type="text/javascript">
function showDiv() {
    document.getElementById('four-more-portfolio-items').style.display = "block";}
</script>

和HTML：

<div id="four-more-portfolio-items" style="display: none;">
......
......
......
</div>

Answer 1

您可以使用jQuery toggle()方法完成此任务。

$("#button_id").click(function() {
    $("#four-more-portfolio-items").toggle();
});

请参阅http://api.jquery.com/toggle/

Answer 2

脚本：

<script>
function showDiv() {
    var x = document.getElementById("four-more-portfolio-items");
    if(x.style.display == "none") {
        x.style.display = "block";
    } else {
        x.style.display = "none";
    }
}
</script>

HTML：

<div id="four-more-portfolio-items" style="display: none;">
......
......
......
</div>

<button onClick="showDiv()">Show Div</button>

程序div的开头没有显示，但是单击后显示。

我的按钮显示div，但如何在第二次点击后隐藏div？

2 个答案: