dom事件对象
2016-07-24 本文已影响0人
凭添一笔惨淡
事件定义
通过用户，或者数据模拟触发全局或者局部发生一些可见或者不可见的变动；
常见事件
1.鼠标事件
onclick点击事件
oncontextmenu用户点击鼠标右键上下文菜单时触发.
ondblclick双击事件
onmouserenter鼠标移动到元素时触发
onmouseover 鼠标移入事件（支持事件冒泡|内部元素触发）
onmouseleave当鼠标移除元素时触发(内部元素不触发)
onmouseout鼠标从某元素移开(支持事件冒泡|内部元素触发 )
onmousemove鼠标移动
onmousedown 鼠标按下事件
onmouseup鼠标按键松开
2.键盘事件
onkeydown某个键盘按键被按下
onkeypress某个键盘按键被按下并松开
onkeyup某个键盘按键被松开
3.框架对象（frame/object）事件
onabort图像加载被中断
onbefireunload该事件在即将离开页面（刷新或关闭）时触发
onerror加载文档或图像时发生错误（<object>,<body>,<framest>）
onhashchange该事件在当前URL的锚部分发生修改时触发
onload页面或者图片加载完成时
onpageshow该事件在用户访问页面触发
onresize窗口或框架被重新调整大小
onscroll当文档滚动式发生的事件
onunload用户退出页面（<body><frameset>）
4.表单事件
onblur元素失去焦点时触发
onchange该事件在表单元内容改变时触发（<input>,<keygen>,<select>,<textarea>）
onfocus元素获取焦点时触发
onfocusin元素即将获取焦点时触发
onfocusout元素即将失去焦点时触发
oninput元素获取用户时触发
onsearch向搜索域输入文本时触发(<input="search">)
onreset表单重置时触发
onselect用户选取文本时触发（<input><textarea>）
onsubmit表单提交时触发
5.剪贴板事件
oncopy在用户拷贝元素内容时触发
oncut在用户剪切元素内容时触发
onpaste在用户粘贴元素内容时触发
6.打印事件
onafterprint该事件在页面已经开始打印，或者答应窗口已经关闭时触发
onbeforeprint该事件在页面即将开始打印时触发
7拖动事件
ondrap在元素正在拖动时触发
ondragend在元素完成拖动时触发
ondragenter在元素拖动进入放置目标
ondragleave在拖动元素离开放置目标上时触发
ondragover在拖动元素在放置目标上时触法
ondragstart在用户开始拖动元素时触发
ondrop拖动元素放置在目标区域时触发
8.媒体事件（略过）
9.动画事件
animationend在css动画结束播放时触发
animationiteration在css动画重复播放时触发
animationstart在css动画开始时触发
10.过渡事件
transitionend在css完成过度后触发
11.其他事件（浏览器事件等。。。）
常见绑定方法
1.dom行内添加事件
<divonclick="show()"></div
2.dom.onclick=fun
dom.onclick=function(){};
3.IE5+/windows绑定事件
dom.attachEvent("onclick",fun)
4.W3cDom事件监听addEventListenner
dom.addEventListenner("click",fun)
事件对象
事件对象在过程中通常以参数形式传入函数中,如下代码中函数传入的e便是次事件对象：
document.getElementById("box").addEventListenner("click",function(e){
})
1.对象获取
<buttonid="btn">点击</button>
<script>
varbtn=document.getElementById("btn");
btn.addEventListener("click",function(e){
vareve=e||window.event;
console.log(eve);
})
</script
2.对象属性
a).bubbles--判断事件是否属于起泡事件，如果是返回true，否则返回false
1).捕获阶段
2).自身触发阶段
3).冒泡阶段
b).cancelable--返回布尔值，是否可取消默认动作
c).currentTarget--返回事件监事件的元素（事件节点）
d).target--返回触发事件的元素（点击节点）
3.方法
a).iniEvent()初始化新创建的Event对象属性
b).preventDefault()不执行默认动作
c).stopPropagation()不再派发时间(阻止冒泡)
鼠标键盘事件对象
1.属性(精简)
altKey返回当事件被触发时alt是否被按下
ctrlKey同上ctrl
shiftKey同上shift
button返回事件被触发是，哪个鼠标按键被点击
clientX返回事件触发时鼠标指针的水平坐标(相对于页面)
clientY返回事件触发时鼠标指针的垂直坐标(相对于页面)
key返回键盘事件的按键值(按的什么返回什么)
keyCode返回键盘事件按键的字符代码(常用)
which同上(兼容不同浏览器可同时使用)
relatedTarget返回鼠标移入移出事件触发时与目标结点间切换的节点
screenX返回事件触发时鼠标指针的水平坐标(相对于屏幕)
screenY返回事件触发时鼠标指针的垂直坐标(相对于屏幕)
