事件

事件

• 1.事件驱动要素
• 1.1.事件源：触发事件的元素
• 1.2.事件：被JavaScript侦测到的行为
• 2.事件分类：鼠标事件，键盘事件，表单事件，页面事件
• onclick：鼠标点击操作
• ondbiclick:鼠标双击事件
• onmousedown:按下鼠标按键
• onmouseup：抬起鼠标按键
• onmousemove:鼠标指针在元素上方移动
• onmouseover：鼠标指针进入元素
• onmouseout：鼠标指针移出元素
• Dommousescroll：鼠标滚轮事件（FF）
• onmousewheel：鼠标滚轮事件（IE，CHROM）
• onkeyup：抬起键盘按键
• onkeydown：按下键盘按键
• onkeypress：按下或按住键盘按键
• onsubmit：按下表单的提交按钮
• onblur：input失去焦点
• onfoucs：input获得焦点
• onchange：更改input元素的内容
• onload：页面加载完成
• onunload：文档的载入被撤销（页面跳转等情况时）
• onbeforeunload：页面刷新或关闭时
• 3.事件绑定：

- 在标签中绑定

<input type = "button" id = "btn" , valuo = "点击" , onclick = "test()" />

-监听器：如果绑定多个条件，那么先执行后面的，反过来执行

btn.attchEvenr("onclick","fn")

• 4.条件对象：
• 4.1.什么是事件源对象：事件源对象event对象，其封锁了与事件相关的信息

- 4.2.获取EVENT对象

btn.onclick = function(e){
var ev = e || window.event

- 4.3.鼠标事件：

var wrap = document.getElementById("wrap")
wrap.onclick = function(e){
var ev = e|| window.event
//距离浏览器
this.innerText = ev.clientX+""+ev.clientY
//距离屏幕
this.innerHTML = ev.screenX+""ev.screenY
//相对于div（元素）本身距离（距离事件源）
this.innerHTML = ev.offsetX+""ev.pffsetY

• 键盘事件
• 键盘码：
• 回车：13
• Ctrl：17
• Shift：16
• 上：38
• 左：37
• 右：39
• 下：40

- 空格：32

//获取键盘码
wrap.innerHTML = ev.keycode

- type属性：用来检测事件类型

console.log(e.type)