JavaScript-事件

Posted 2021-01-14

事件：触发特定条件，完成某一项功能

学习目的：在指定条件下，完成特定的功能

　　　　　条件满足的情况下，系统会自动(回调)执行某项方法

 

一、事件的两种绑定方法：

1、on绑定方式
   这种方式只能绑定一个方法，如果绑定了两个，那么第二个会覆盖掉第一个
   取消该事件的方式 onclick = ‘‘;
2、非on绑定方式
   这种绑定方式可以绑定多个方法。
   //设置绑定事件的方法
   var func = function () {}
   div.addEventListeners(‘click‘,func)

   //取消绑定事件的方法
   div.removeEventlistener(‘click‘,func)

二、冒泡：父子级拥有同一事件时，子级触发事件，那么它的父级也会触发该事件

　　默认事件：一些事件存在默认的系统操作，比如鼠标右键会弹出菜单栏，通过返回值false，取消默认。

三、鼠标事件

onclick    鼠标点击
ondbclick  鼠标双击
onmousedown 鼠标按下
onmouseup   鼠标抬起
onmousemove 鼠标移动
onmouseover 鼠标悬浮
onmouseout  鼠标移开
oncontextmenu   鼠标右键


ev.clientX  x轴
ev.clientY  y轴

四、键盘事件

onkeydown:键盘按下
onkeyup：键盘抬起

ev.keyCode：每个键对应的数字

五、表单事件

onfocus:获取焦点
onblur：失去焦点
onselect:文本被选中
oninput:值改变
onchange:值改变，失去焦点后触发
onsubmit：表单默认提交事件

六、文档、页面事件

onload:页面加载成功
onscroll 页面滚动
onresize:页面尺寸调整