当前位置:清晨 » 站长笔记 » javascript笔记 » js点击按钮显示或隐藏内容

js点击按钮显示或隐藏内容

发布日期:2018年8月7日 08:08:27

点击量: 19

js点击按钮显示或隐藏内容,可以做手机版的菜单功能,比较方便.

js代码

<script type="text/javascript">
window.onload=function(){
  var obt=document.getElementById("all");
  var odiv=document.getElementById("menu");
  obt.onclick=function(){
    if(odiv.style.display=="none"){
      odiv.style.display="block";
      obt.value="隐藏模块";
    }
    else{
      odiv.style.display="none";
      obt.value="显示模块";
    }
  }
}
</script>

 

html代码

<div id="all">菜单</div>
<div id="menu" style="display:none;">
<ul>
<li>首页</li>
<li>产品</li>
<li>资讯</li>
</ul>
<div>

 

 

 

 

 


关键词:

本文网址:http://www.menglei.info/2559/,转载请以链接形式注明出处,谢谢合作!


老薛主机专属优惠码: PT ,有需要购买的同学可以使用.可享受30%的优惠.


发表评论

电子邮件地址不会被公开。 必填项已用*标注