javascript简单弹出层

1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2  <html>
3 <head>
4 <title>disabled</title>
5 <style type="text/css">
6 *{margin:0px;padding:0px}
7 .button{border:1px solid #950074;width:180px;height:24px;line-height:24px;text-align:center;font-size:12px}
8 </style>
9 <script type="text/javascript" src="jquery-1.4.1.min.js"></script>
10 <script type="text/javascript">
11 window.onload=function()
12 {
13 var getButton=document.getElementsByTagName('input')[0];
14 var getDiv=document.getElementsByTagName('div')[0];
15 var dragging=true;//设置状态;
16 getDiv.className="button";//动态添加CSS样式;
17 getButton.onclick=function()
18 {
19 if(dragging==true)
20 {
21 getDiv.style.display="none";
22 this.value="显示文字"
23 return dragging=false;
24 }
25 else
26 {
27 getDiv.style.display="block";
28 this.value="隐藏文字"
29 return dragging=true;
30 }
31 }
32 }
33 </script>
34 </head>
35 <body>
36 <div>
37 <p>我的内容是文字!!<p>
38 </div>
39 <input type="button" value="隐藏文字">
40 </body>
41 </html>

 

总结:

设置状态是否为显示;

posted @ 2010-11-10 16:38  $雨$  阅读(274)  评论(0编辑  收藏  举报