js显示隐藏层
2015-12-01 02:01
351 查看
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>js显示隐藏层</title> <script language="JavaScript" type="text/JavaScript"> <!-- function showdiv(targetid){ var target=document.getElementById(targetid); if (target.style.display=="block"){ target.style.display="none"; } else { target.style.display="block"; } } --> </script> <style type="text/css"> <!-- body { font: normal 14px "宋体" } a { text-decoration: none; } #showtext { cursor: hand; cursor:pointer;} #showtext2 { cursor: hand; cursor:pointer;} #contentid { margin-top: 10px; width:100%; border: 1px solid #CCC; background: #F1F1F1; padding: 15px; } #contentid2 { margin-top: 10px; width: 470px; border: 1px solid #CCC; background: #F1F1F1; padding: 15px; } .none { display: none; } --> </style> </head> <body> <a id="showtext" onClick="showdiv('contentid','showtext')">点击查看详细信息</a> <div id="contentid" class="none">打开的内容</div> <p></p> <a id="showtext2" onClick="showdiv('contentid2','showtext2')">点击查看详细信息</a> <div id="contentid2" class="none">1<br /> 2.<br /> 3.<br /> 4.<br /> 5.<br /> 6. <br /> 7.<br /> 8. <br /> 9.<br /> 10.<br /> 11.<br /> 12. <br /> 13.<br /> 14. <br /> 15.<br /> </div> </body> </html>
相关文章推荐
- [Javascript] Advanced Reduce: Common Mistakes
- Javascript如何获取选中checkbox的值
- Javascript操作DOM常用API总结
- 6种javascript显示当前系统时间代码
- 超全的js正则表达式整理笔记
- js跨域请求数据的3种常用的方法
- 深入JavaScript高级程序设计之对象、数组(栈方法,队列方法,重排序方法,迭代方法)
- javascript定义类和类的实现实例详解
- 详解JavaScript函数
- 常见JS验证脚本汇总
- 基于JavaScript操作DOM常用的API小结
- JS验证邮件地址格式方法小结
- js获取及判断键盘按键的方法
- 整理Javascript函数学习笔记
- JavaScript保留关键字汇总
- JavaScript使用DeviceOne开发实战(一) 配置和起步
- JavaScript使用DeviceOne开发实战(二) 生成调试安装包
- 6种javascript显示当前系统时间代码
- js实现继承的5种方式
- 关于JSP页面表单提交中文乱码问题和URL中文参数乱码问题