Javascript事件
2021-02-18 12:19
阅读：548
YPE html>
标签：mouseover 网页 psk UNC com tab center 导航 鼠标悬停
事件
在什么时候执行什么事
事件的三要素
- 事件源：触发事件的元素
- 事件类型：事件的触发方式
- 事件处理程序：事件触发后要执行的代码
例如：
| 事件名 | 说明 |
|---|---|
| onclick | 鼠标单击 |
| ondblclick | 鼠标双击 |
| onkeyup | 按下并释放键盘上的一个键时触发 |
| onchange | 文本内容或下拉菜单中的选项发生改变 |
| onfocus | 获得焦点，表示文本框等获得鼠标光标。 |
| onblur | 失去焦点，表示文本框等失去鼠标光标。 |
| onmouseover | 鼠标悬停，即鼠标停留在图片等的上方 |
| onmouseout | 鼠标移出，即离开图片等所在的区域 |
| onload | 网页文档加载事件 |
| onunload | 关闭网页时 |
| onsubmit | 表单提交事件 |
| onreset | 重置表单时 |
鼠标单击事件
点击我
点击我
鼠标双击事件
请点击该文本
鼠标移除悬停
简单实例：
导航样式切换
Title
事件监听
添加监听方法
addEventListener()
点用户点击按钮时触发监听事件：
window.addEventListener(‘load‘,init,false);
function init(){
alert("页面加载成功");
}
//或者
window.addEventListener(‘load‘,function(){
alert("页面加载成功");
},false);
element.addEventListener(event, function, useCapture)中的第三个参数可以控制指定事件是否在捕获或冒泡阶段执行。
true - 事件句柄在捕获阶段执行
false- 默认- 事件句柄在冒泡阶段执行，当值为true时，事件使用捕获传递
addEventListener() 可以给同一个元素绑定多个事件，不会发生覆盖的情况。如果给同一个元素绑定多个事件，那么采用先绑定先执行的规则。
addEventListener() 在绑定事件的时候，事件名称之前不需带 on 。
事件冒泡/事件捕获
在冒泡中，内部元素的事件会先被触发，然后再触发外部元素，即：
元素的点击事件先触发，然后会触发
元素的点击事件
在捕获中，外部元素的事件会先被触发，然后才会触发内部元素的事件，即：
元素的点击事件先触发 ，然后再触发
元素的点击事件。
移除监听方法
removeEventListener()
移除之前绑定过的事件
// 向 元素添加事件句柄
document.getElementById("myDIV").addEventListener("mousemove", myFunction);
// 移除 元素的事件句柄
document.getElementById("myDIV").removeEventListener("mousemove", myFunction);
Javascript事件
标签：mouseover 网页 psk UNC com tab center 导航 鼠标悬停
原文地址：https://www.cnblogs.com/qimuz/p/12690432.html
踩
(0)
赞
(0)
举报
评论 一句话评论（0）
上一篇：C语言一行语句太长的换行处理方法
下一篇：javascript数组认识
评论
亲，登录后才可以留言！