HTML5，div，隐藏，点击显示 [英] HTML5, div, hidden, show on click

问题描述

我最后有一个带按钮的div。我希望当有人按下那个按钮时，另一个div（在前一个下面）应该出现我把它放在div中的内容。

I have a div with a button at the end. I want that when someone presses that button another div (below the previous one) should appear with the content I have put it inside the div.

我使用下面的代码：

HTML：

<div>
    <a id="button" href="#">REGISTER</a>
</div>
<br>
<br>
<div id="item">
    <iframe src="some source" embedded=true" width="760" height="550" frameborder="0" marginheight="0" marginwidth="0">Loading</iframe>
</div>

以及带脚本的jquery：

and the jquery with script:

<script>
    $(function() {
        $( "#button" ).click(function() {
            $( "#item" ).toggle();
        });
    });
</script>

我遇到的问题是第二个div最初出现在页面加载本身上，当我点击按钮时它会消失。
什么我应该这样做吗？

The problem I am having is that the second div is appearing on page load itself initially and when I am clicking on the button its disappearing. What should I do?

推荐答案

HTML5使您可以使用详细信息标签轻松完成。

HTML5 enables you to do it easily using the details tag.

<details>
    <summary>Click to toggle division</summary>
    <p>Here you can put some content...</p>
    <p>... and anything else you want :)</p>
</details>

以下是演示： https://jsfiddle.net/3wqyyf7m/

这篇关于HTML5，div，隐藏，点击显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！