小代码 HTML 每个按钮控制一个DIV js实现
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/><title>js显示隐藏层</title><scriptlanguage="JavaScript"type="text/JavaScript"><!--functionshowdiv(targetid,objN){vartarget=document.getElementById(targetid);varclicktext=document.getElementById(objN)if(target.style.display=="block"){target.style.display="none";clicktext.innerText="打开编辑";}else{target.style.display="block";clicktext.innerText='关闭编辑';}}--></script><styletype="text/css"><!--body{font:normal14px"宋体"}#showtext{cursor:hand;cursor:pointer;}#showtext2{cursor:hand;cursor:pointer;}#wzshowtext{cursor:hand;cursor:pointer;}#contentid{margin-top:10px;width:100%;border:1pxsolid#CCC;background:#F1F1F1;padding:15px;height:30px}#wzcontentid{margin-top:10px;width:100%;border:1pxsolid#CCC;background:#F1F1F1;padding:15px;height:30px}#contentid2{margin-top:10px;width:470px;border:1pxsolid#CCC;background:#F1F1F1;padding:15px;}.none{display:none;}--></style></head><body><buttontype="button"id="wzshowtext"onClick="showdiv('wzcontentid','wzshowtext')">打开编辑</button><divid="wzcontentid"class="none">打开的内容</div><hr><buttontype="button"id="showtext"onClick="showdiv('contentid','showtext')">打开编辑</button><divid="contentid"class="none">打开的内容</div><p></p><buttontype="button"id="showtext2"onClick="showdiv('contentid2','showtext2')">打开编辑</button><divid="contentid2"class="none">打开的内容</div></body></html>
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。