當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
JS点击显示隐藏内容
生活随笔
收集整理的這篇文章主要介紹了
JS点击显示隐藏内容
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
JS點擊顯示隱藏密碼
思路:獲取元素,判斷點擊,如果DIV顯示就隱藏,如果DIV隱藏就顯示出來。
1 if(DIV是顯示的){ 2 div.style.display='none'; 3 } 4 else{ 5 div.style.display='block'; 6 }?
代碼:
style:
1 <style> 2 #text{display:block;width:300px;cursor:pointer;height:20px;border:solid 1px #CCC;} 3 #menu{display:none;width:300px;height:100px;border:solid 1px #CCC;} 4 </style>?
js:
<script type="text/javascript"> window.onload=function(){var wenzi=document.getElementById('text');var div=document.getElementById('menu');wenzi.onfocus=function(){if(div.style.display=='block'){ // == 判斷div.display是否為顯示 div.style.display='none'; //= 賦值也可了解成改變 }else{div.style.display='block';}} }; </script>?
html
<span id="text">點擊顯示菜單,再點擊隱藏菜單</span> <div id="menu">這是文字哦。</div>?
轉載于:https://www.cnblogs.com/52css/archive/2013/02/26/2934284.html
總結
以上是生活随笔為你收集整理的JS点击显示隐藏内容的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 查看android keystore 别
- 下一篇: (转)fastcgi简介