How can I hide/show a div when a button is clicked?

前端未结

关注

 8  1922

I have a div that contains a register wizard, and I need hide/show this div when a button is clicked. How can I do this?

Below I show you t

相关标签:

8条回答

孤独总比滥情好

2020-12-04 22:23

This works:

     function showhide(id) {
       	var e = document.getElementById(id);
       	e.style.display = (e.style.display == 'block') ? 'none' : 'block';
     }

    <!DOCTYPE html>
    <html>   
    <body>
    
    	<a href="javascript:showhide('uniquename')">
    		Click to show/hide.
    	</a>
    
    	<div id="uniquename" style="display:none;">
    		<p>Content goes here.</p>
    	</div>
    
    </body>
    </html>

0 讨论(0)

忘掉有多难

2020-12-04 22:27
The following solution is:
- briefest. Somewhat similar to here. It's also minimal: The table in the DIV is orthogonal to your question.
- fastest: getElementById is called once at the outset. This may or may not suit your purposes.
- It uses pure JavaScript (i.e. without JQuery).
- It uses a button. Your taste may vary.
- extensible: it's ready to add more DIVs, sharing the code.
```
mydiv = document.getElementById("showmehideme");

function showhide(d) {
    d.style.display = (d.style.display !== "none") ? "none" : "block";
}
```
```
#mydiv { background-color: #ffffd; }
```
```
<button id="button" onclick="showhide(mydiv)">Show/Hide</button>
<div id="showmehideme">
    This div will show and hide on button click.
</div>
```
0 讨论(0)
发布评论:

提交评论
- 加载中...

上一页 1 2