鼠标事件

click 点击事件

box.onclick = function(){console.log("单机执行");} 

dblclick双击事件

box.ondblclick = function(){console.log("双击执行");}

contextmenu 右键单击

box.oncontextmenu=function(){console.log("右键单击.自定义右键菜单");}

mousedown鼠标按下 mousemove移动 mouseup抬起

btn.onmousedown=function(){console.log("鼠标按下");}//移动var i=document.querySelector("#move")i.onmousemove=function(){console.log("鼠标移动");}//抬起btn.onmouseup=function(){console.log("鼠标抬起");}

移入移出 mouseover mouseout

进入子元素也会移出。

m2.onmouseover=function(){console.log("移入");}m2.onmouseout=function(){console.log("移出");}

移入移出 mouseenter mouseleave

    m2.onmouseenter=function(){console.log("移入");}m2.onmouseleave=function(){console.log("移出");}

键盘事件

用于（ window,document, 输入框 input）

例如< input type="text" id="username">

keydown按下键盘

username.onkeydown = function(){console.log("按下键盘");}

keyup抬起键盘

username.onkeyup = function(){console.log("抬起键盘");}

表单事件

focus 获取焦点 blur 失去焦点

//光标所在 获取焦点box.onfocus = function(){console.log("获取焦点");}//光标移开 失去焦点box.onblur = function(){console.log("失去焦点");}  

change 获取焦点

在失去焦点时对比里面内容不一样才会触发

box.onchange = function(){console.log("change");} 

input内容不一样类似于百度，每输入一个，就执行一次。

box.oninput=function(){console.log("input");}

submit 提交, reset 重置

在form表单中使用

myform.onsubmit = function(){console.log("submit");return false//阻止事件}myform.onreset = function(){console.log("reset");}

触摸事件

触摸touchstart、按住移动touchmovr、松开touchend

box.ontouchstart = function(){console.log("触摸touchstart");}

    box.ontouchmove = function(){console.log("按住移动touchmovr");}

    box.ontouchend = function(){console.log("松开touchend");}

按住移动中来电打断的情况 触发

box.ontouchcancel = function(){console.log("touchcancel");}