1.onload和onunload是打开与关闭页面事件,可以用来出cookie。
1 <!DOCTYPE html>
2 <html>
3 <body onload="checkCookies()"> //打开body页面的时候触发函数
4
5 <script>
6 function checkCookies()
7 {
8 if (navigator.cookieEnabled==true) //检查cookie并弹窗提示
9 {
10 alert("已启用 cookie")
11 }
12 else
13 {
14 alert("未启用 cookie")
15 }
16 }
17 </script>
18
19 <p>提示框会告诉你,浏览器是否已启用 cookie。</p>
20 </body>
21 </html>
2.onchange是在改变时触发。
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5 <script>
6 function myFunction()
7 {
8 var x=document.getElementByIdx_x("fname");
9 x.value=x.value.toUpperCase(); //toUpperCase大写转换
10 }
11 </script>
12 </head>
13 <body>
14
15 请输入英文字符:<input type="text" id="fname" onchange="myFunction()">
16 <p>当您离开输入字段时,会触发将输入文本转换为大写的函数。</p>
17
18 </body>
19 </html>
3.onmouseover和onmouseout,鼠标移入和移除时触发。
1 <!DOCTYPE html>
2 <html>
3 <body>
4
5 <!-- this表示当前元素,所以在Function里就不必使用getElementById来获取元素了。-->
6 <div onmouseover="mOver(this)" onmouseout="mOut(this)" style="background-color:green;120px;height:20px;padding:40px;color:#ffffff;">把鼠标移到上面</div>
7
8 <script>
9 function mOver(obj)
10 {
11 obj.innerHTML="谢谢"
12 }
13
14 function mOut(obj)
15 {
16 obj.innerHTML="把鼠标移到上面"
17 }
18 </script>
19
20 </body>
21 </html>
4.onmousedown鼠标按下,onmouseup鼠标弹起,onclick鼠标点击。
1 <!DOCTYPE html>
2 <html>
3 <body>
4
5 <div onmousedown="mDown(this)" onmouseup="mUp(this)" style="background-color:green;color:#ffffff;90px;height:20px;padding:40px;font-size:12px;">请点击这里</div>
6 <br>
7 <div onClick="mClick(this)" style="background-color:green;color:#ffffff;90px;height:20px;padding:40px;font-size:12px;">用onClick来触发函数,实现变色</div>
8 <script>
9 function mDown(obj)
10 {
11 obj.style.backgroundColor="#1ec5e5";
12 obj.innerHTML="请释放鼠标按钮";
13 }
14
15 function mUp(obj)
16 {
17 obj.style.backgroundColor="green";
18 obj.innerHTML="请按下鼠标按钮";
19 }
20 //用onClick来实现变色,第1次学习的灯泡就是用这个onclick来触发实现。
21 function mClick(obj)
22 {
23 if (obj.style.backgroundColor.match("green"))
24 {
25 obj.style.backgroundColor="red";
26 obj.innerHTML="用onClick来触发函数,实现变色";
27 }
28 else
29 {
30 obj.style.backgroundColor="green";
31 obj.innerHTML="用onClick来触发函数,实现变色";
32 }
33 }
34 </script>
35
36 </body>
37 </html>