事件分为鼠标事件，键盘事件，表单事件以及移动端事件，今天主要介绍一下鼠标键盘以及表单事件
鼠标事件
- redDiv.onclick=function(){ console.log("onclick点击事件");}
- onmouseover,onmouseout会在鼠标从父级移入子集元素的时候触发
- onmouseenter，onmouseleave只有在移入移出父级和子集的整体的时候触发
- redDiv.onmouseover=function(){ console.log("onmouseover鼠标移入事件");}
- redDiv.onmouseout=function(){ console.log("onmouseout鼠标移出事件");}
- redDiv.onmouseenter=function(){ console.log("onmouseeneter鼠标移入事件");}
- redDiv.onmouseleave=function(){ console.log("onmouseleave鼠标移出事件");}
- redDiv.onmousedown=function(){ console.log("onmousedown鼠标按下事件");}
- redDiv.onmouseup=function(){ console.log("onmouseup鼠标抬起事件");}
- redDiv.ondblclick=function(){ console.log("ondblclick双击");}
- redDiv.oncontextmenu=function(){ console.log("oncontextmenu鼠标右键"); return false;}
- redDiv.onmousemove=function(){ console.log("onmousemove鼠标移动");}
键盘的事件
只有成为焦点的元素才能触发键盘事件
- document.getElementById("uname").onkeydown=function(){ console.log("键盘按下")}
- document.onkeyup=function(){ console.log("键盘抬起") }
- document.onkeypress=function(){ console.log("press键盘按下")}
表单事件
var first=document.getElementById("first");
var uname=document.getElementById("uname");
- uname.onblur=function(){ console.log("blur失去了焦点")}
- uname.onchange=function(){ console.log("change内容发生了变化")}
- uname.onfocus=function(){ console.log("获取焦点")}
- uname.oninput=function(){ console.log("输入")}
输入框内容发生变化的时候，即时 - first.onsubmit=function(){ console.log("用户提交了表单");
点击的是提交按钮，form表单触发onsubmit - first.onreset=function(){ console.log("用户重置777777了表单"); return false;}
一些事件中系统会有默认事件触发，比如，右键的时候会弹出菜单，比如按了提交按钮会跳转网页，这些都是默认事件，默认事件可以被阻止：return false; return false;}
