JS点击显示隐藏密码
思路:获取元素,判断点击,如果DIV显示就隐藏,如果DIV隐藏就显示出来。
1 if(DIV是显示的){2div.style.display='none';3 }4 else{5div.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>