DHTML_____如何编写事件处理程序

<html>
<head>
  <meta charset="utf-8">
  <title>如何编写事件处理程序</title>
</head>

<body oncontextmenu="hidecontentmenu()">
<div style="text-align:center"><b>如何编写事件处理程序</b></div>
<div>
    <span onmouseover="demo('idDiv1')">111</span>
    <span>&nbsp;&nbsp;</span>
    <span onmouseover="demo('idDiv2')">222</span>
</div>
<div>
    <p id="idDiv1">qqqqqqqqqqqqqqqqqqqqqq</p>
    <p id="idDiv2" style="display:none">wwwwwwwwwwwwwwwwwwwwww</p>
</div>
<button onclick="close2()">button</button>
<script language="javascript">
    //方式一   设置鼠标右击不弹出上下文
    function hidecontentmenu(){
        window.event.returnValue=false;//方式二  在这里改成return false;   在body中改成return hidecontentmenu()
    }//方式三  直接在body中设置为oncontextmenu="return false"
    
    //方式四  设置元素对象的事件属性，使事件属性值等于函数名或程序代码
    //document.oncontextmenu=hidecontentmenu;
    
    //方式五  for指定事件源  event指定事件名
    //<script language="javascript" for="document" event="oncontextmenu">
    //  window.event.returnValue=false;
    
    
    function close2(){
        //window.open("http://www.baidu.com","_blank","top=0,left=0,width=200px,height=200px,toolbar=no");
        //window.setTimeout('window.close()',5000);
    }


老师上午所讲    
    //onclick的两种写法
    //document.getElementById("Id").onclick=close2;//函数名
    //document.getElementById("Id").click();
    
</script>



<script language="javascript">
function demo(obj){
    for(var i=1;i<5;i++){
        var id=document.getElementById('idDiv'+i);
        if(id!=null){
            id.style.display="none";
        }
    }    
    var idDiv=document.getElementById(obj);
    idDiv.style.display="block";
}
</script>
</body>
</html>

View Code

 1 <html>
 2 <head>
 3   <meta charset="utf-8">
 4   <title>如何编写事件处理程序</title>
 5 </head>
 6 
 7 <body oncontextmenu="hidecontentmenu()">
 8 <div style="text-align:center"><b>如何编写事件处理程序</b></div>
 9 <div>
10     <span onmouseover="demo('idDiv1')">111</span>
11     <span>&nbsp;&nbsp;</span>
12     <span onmouseover="demo('idDiv2')">222</span>
13 </div>
14 <div>
15     <p id="idDiv1">qqqqqqqqqqqqqqqqqqqqqq</p>
16     <p id="idDiv2" style="display:none">wwwwwwwwwwwwwwwwwwwwww</p>
17 </div>
18 <button onclick="close2()">button</button>
19 <script language="javascript">
20     //方式一   设置鼠标右击不弹出上下文
21     function hidecontentmenu(){
22         window.event.returnValue=false;//方式二  在这里改成return false;   在body中改成return hidecontentmenu()
23     }//方式三  直接在body中设置为oncontextmenu="return false"
24     
25     //方式四  设置元素对象的事件属性，使事件属性值等于函数名或程序代码
26     //document.oncontextmenu=hidecontentmenu;
27     
28     //方式五  for指定事件源  event指定事件名
29     //<script language="javascript" for="document" event="oncontextmenu">
30     //  window.event.returnValue=false;
31     
32     
33     function close2(){
34         //window.open("http://www.baidu.com","_blank","top=0,left=0,width=200px,height=200px,toolbar=no");
35         //window.setTimeout('window.close()',5000);
36     }
37 
38 
39 老师上午所讲    
40     //onclick的两种写法
41     //document.getElementById("Id").onclick=close2;//函数名
42     //document.getElementById("Id").click();
43     
44 </script>
45 
46 
47 
48 <script language="javascript">
49 function demo(obj){
50     for(var i=1;i<5;i++){
51         var id=document.getElementById('idDiv'+i);
52         if(id!=null){
53             id.style.display="none";
54         }
55     }    
56     var idDiv=document.getElementById(obj);
57     idDiv.style.display="block";
58 }
59 </script>
60 </body>
61 </html>