事件处理 一、事件源：任何一个HTML元素（节点） body,div,button,p,a... 二、事件：你的操作 鼠标： click 单机 dbclick 双击 textcontentmenu （在body）文本菜单 mouseover 放上 mouseout 离开 mousedown 按下 mouseup 抬起 mousemove 移动 键盘： keypress 键盘事件 数字字母键才能触发 keyup 抬起 keydown 按下 文档： load 加载:页面加载完后触发 unload 关闭 beforeunload 关闭之前 表单： focus 焦点 blur 失去焦点 submit 提交事件 change 改变 其他： scroll 滚动事件 selected 事件 。。。 三、事件处理程序 有三种方式添加事件 第一种： 格式：<tag on事件="事件处理程序" /> 第二种： <script> 对象.on事件=事件处理程序 </script> 第三种：（不常用） <script for="事件源" event="事件">事件处理程序</script>
<html> <head> </head> <body> <!--<div id="one" onclick="show()">--> <div id="one" onmouseover="show(this,'red')" onmouseout="show(this,'blue')" onclick="show(this,'yellow')"> wwwwwww </div> <!-- <script> var one=document.getElementById("one"); one.onclick=function(){ this.style.background="red"; } function show(){ alert(document.getElementById("one").innerText); } </script> --> <!-- <script for="one" event="onclick">//IE支持，火符不支持 var one=document.getElementById("one"); one.style.backgroundColor="yellow"; </script> --> <script> function show(obj,col){ obj.style.backgroundColor=col; } </script> </body> </html>
<html> <head> <div id="one"> ######### </div> </head> <!--<body oncontextmenu="alert('11'); return false;">如果想要右键后不出现菜单，在后面加上return false,这个可以用来做表单验证--> <!--<body oncontextmenu="test()">这样可以达到前面的效果吗？不可以，因为这样相当于直接contextmenu=false --> <!--<body oncontextmenu="return test()">--> <body onload="test()" onunload="leave()" onbeforeunload="beforeleave()"> <script> function test(){ var one=document.getElementById("one"); alert(one.innerText); return false; } function leave(){ alert("离开"); } function beforeleave(){ event.returnValue="你小心点"; } </script> </body> </html>