事件监听机制
事件是可以被JavaScript侦测到的行为。HTML事件是发生在HTML元素上的事情。当在HTML页面中使用JavaScript时，JavaScript可以触发这些事件。
HTML事件
HTML事件可以是浏览器行为，也可以是用户行为。HTML网页中的每个元素都可以产生某些可以触发JavaScript函数的事件。以下是HTML事件的实例：
HTML页面完成加载
HTMLinput字段改变时
HTML按钮被点击
通常，当事件发生时，你可以做些事情，在事件触发时JavaScript可以执行一些代码。HTML元素中可以添加事件属性，使用JavaScript代码来添加HTML元素。
将事件，事件源，监听器结合在一起。当事件源上发生了某个事件，则触发执行某个监听器代码。
常见的事件
①点击事件
onclick：单击事件
ondblclick：双击事件
比如：
document.getElementById("button").onclick=function(){alert("我被点了....");}
document.getElementById("button").ondblclick=function(){alert("咋老点我....");}
②焦点事件
onblur：元素失去焦点
onfocus：元素获得焦点
一般用于表单验证，比如判断密码长度是否符合要求：
document.getElementById("password").onblur=function(){varpassword=document.getElementById("password").value;vars_password=document.getElementById("s_password");if(password.length5){s_password.innerHTML="密码长度符合要求！";}else{s_password.innerHTML="密码长度不能少于6位！";}}
③加载事件
onload：一张页面或一幅图像完成加载。
比如：
window.onload=function(){alert("页面加载完毕！");}
④鼠标事件
onmousedown鼠标按钮被按下。
onmouseup鼠标按键被松开。
onmousemove鼠标被移动。
onmouseover鼠标移到某元素之上。
onmouseout鼠标从某元素移开。
运用方法与上面相同。比如：
document.getElementById("button").onmouseover=function(){alert("鼠标来了....");}
当鼠标点击时，我们还可以判断是哪个键点的，比如：
document.getElementById("button").onmousedown=function(event){if(event.button==0){alert("鼠标左键点的我");}elseif(event.button==2){alert("鼠标右键点的我");}}
⑤键盘事件
onkeydown某个键盘按键被按下。
onkeyup某个键盘按键被松开。
onkeypress某个键盘按键被按下并松开。
键盘事件与鼠标事件相似，也可以获取相应的键值，比如：
document.getElementById("username").onkeydown=function(event){alert(event.keyCode);};
我们最常用的是点击回车提交表单，比如：
document.getElementById("username").onkeydown=function(event){if(event.keyCode==13){form.submit();}};
⑥选择和改变
onchange域的内容被改变。
onselect文本被选中。
一般用于表单中内容的展示，比如性别选中男，则显示与男有关的内容。
⑦表单事件
onsubmit确认按钮被点击。
onreset重置按钮被点击。
oninput元素获取用户输入时
onsubmit的主要作用是阻止表单提交，如果返回值为true则提交，如果返回值为false则不提交。比如：
document.getElementById("form").onsubmit=function(){if("表单验证通过"){returntrue;}returnfalse;};
注意：该方法一定要设置返回值，否则默认为true，不会阻止表单提交。尤其是在标签体中绑定事件的时候，一定要加返回值，即：formonsubmit="returncheck();"
预览时标签不可点收录于话题#个上一篇下一篇