(050)javascript_event_popmenu

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5     <title>EVENT</title>
 6     <style type="text/css">
 7         #myDiv {
 8             width: 200px;
 9             height: 300px;
10             background: gray;
11             display: none;
12         }
13     </style>
14     <script type="text/javascript">
15 
16         window.onload = function() {
17 
18             var popBtn = document.getElementById("popBtn");
19             var myDiv = document.getElementById("myDiv");
20 
21             popBtn.onclick = function(ev) {
22                 myDiv.style.display = "block";
23                 var oEvent = ev || event;
24                 oEvent.cancelBubble = true;
25                 //alert("按钮点击");
26             };
27 
28             document.onclick = function() {
29                 myDiv.style.display = "none";
30                 //alert("页面点击");
31             };
32 
33         };
34 
35     </script>
36 </head>
37 
38 <body>
39 
40     <input id="popBtn" type="button" value="弹出菜单"/>
41 
42     <div id="myDiv"></div>
43 
44 </body>
45 </html>

 

posted @ 2014-03-23 11:18  雪中飞雁  阅读(93)  评论(0)    收藏  举报