javascript中常用事件集合和事件使用方法">Javascript中常用事件集合和事件使用方法
一、事件绑定
格式：
事件源 . on事件类型=事件处理函数
事件绑定三要素
1、事件源：和谁绑定
2、事件类型：什么事件
3、事件处理函数：触发了要执行什么
二、常用事件类型
| 鼠标事件 | 键盘事件 | 浏览器事件 | 触摸事件 | 表单事件 |
|---|---|---|---|---|
| click - 单击 | keydown - 键盘按下 | load - 加载完毕 | touchstart - 触摸开始 | focus - 聚焦 |
| dblclick - 双击 | keyup - 键盘抬起 | scroll - 滚动条滚动 | touchmove - 触摸移动 | blie - 失焦 |
| mousedown - 鼠标按下 | keypress - 键盘键入 | resize - 尺寸改变 | touchend - 触摸结束 | change - 改变 |
| contextmenu - 左键单击 | input - 输入 | |||
| mouseup - 鼠标抬起 | reset - 重置 | |||
| mousemove - 鼠标移动 | ||||
| mouseover - 鼠标移入 | ||||
| mouseout - 鼠标移出 |
三、事件传播
什么是事件传播：当几个div是父子关系时，点击子的事件，父的事件也会触发
1.阻止事件传播
格式：事件对象 . stopPropagation()
js">//点击divc只输出divc的内容
<div id="a">
<div id="b">
<div id="c" ></div>
</div>
</div>
<script>
var diva=document.getgetElementById("a")
var divb=document.getgetElementById("b")
var divc=document.getgetElementById("c")
diva.onclick=function(){
console.log("diva被触发")
}
divb.onclick=function(){
console.log("divb被触发")
}
divc.onclick=function(e){
console.log("divc被触发")
e.stopPropagation() //阻止触发(如果没有这个，三个都会触发)
}
</script>
