javascript——常用事件总结
Event对象:Event 对象代表事件的状态,比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。
|
事件标签属性 |
当以下情况发生时,出现此事件 |
|
onabort |
图像加载被中断 |
|
onchange |
用户改变域的内容 |
|
onclick |
鼠标点击某个对象 |
|
ondblclick |
鼠标双击某个对象 |
|
onerror |
当加载文档或图像时发生某个错误 |
|
onfocus、onblur |
元素获得焦点、失去焦点时触发 |
|
onkeydown、onkeyup |
某个键盘的键被按下、被松开时触发 |
|
onkeypress |
某个键盘的键被按下或按住 |
|
onload、 onunload |
某个页面或图像被完成“加载”、用户退出页面 |
|
onmousedown、onmouseup |
某个鼠标按键被按下、被松开时触发 |
|
onmousemove |
鼠标被移动 |
|
onmouseout |
鼠标从某元素移开 |
|
onmouseover |
鼠标被移到某元素之上 |
|
onresize |
窗口或框架被调整尺寸 |
|
onselect |
文本被选定 |
|
onsubmit、onreset |
提交按钮、重置按钮被点击 |

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script>
function test(){
console.log("李银霞");
}
</script>
</head>
<body>
<!--
1:onchange=" "事件
-->
<select onchange="test()">
<option value="1">一年级</option>
<option value="2">二年级</option>
<option value="3">三年级</option>
</select>
<!--
2:onclick=" "点击事件
-->
<input type="submit" onclick="test()"/>
<!--
3:onfocus=" "获取焦点事件
-->
<input onfocus="test()" />
<!--
4:onblur=" "失去焦点事件
-->
<textarea onblur="test()"></textarea>
<!--
5:onkeydown=""键盘的某个键被按下时触发的事件
-->
<input onkeydown="test()" />
<!--
6:onkeyup=""键盘的某个键被松开时触发的事件
-->
<textarea onkeyup="test()"></textarea>
<br />
<!--
作者:1767757232@qq.com
时间:2018-08-21
描述:
-->
<input onkeypress="test" />
<!--
8:onmousedowm=""鼠标按下事件
-->
<div style="background: red;" onmousedown="test()">
按钮
</div>
<!--
9:onmouseup=""鼠标松开事件
-->
<div style="background: blue;" onmouseup="test()">
按钮
</div>
<!--
10:onmouseover=""鼠标划上去事件
-->
<div style="background: green;" onmouseover="test()">
按钮
</div>
<!--
11:onmouseout=""鼠标滑开事件
-->
<div style="background: purple;" onmouseout="test()">
按钮
</div>
<!--
12:onmousemove=""滑动鼠标事件
-->
<div style="background: black;" onmousemove="test()">
按钮
</div>
</body>
</html>

javascript——常用事件总结的更多相关文章
- BOM之JavaScript常用事件
body, table{font-family: 微软雅黑; font-size: 10pt} table{border-collapse: collapse; border: solid gray; ...
- JavaScript常用事件
一般事件 事件 浏览器支持 描述 onClick HTML: 2 | 3 | 3.2 | 4 Browser: IE3 | N2 | O3 鼠标点击事件,多用在某个对象控制的范围内的鼠标点击 on ...
- JavaScript常用事件参考
onabort 图像加载被中断 onblur 元素失去焦点 onchange 用户改变域的内容 onclick 鼠标点击某个对象 ondblclick 鼠标双击某个对象 onerror 当加载文档 ...
- javascript常用事件及方法
1.获取鼠标坐标,考虑滚动条拖动 var e = event || window.event; var scrollX = document.documentElement.scrollLeft || ...
- javascript之常用事件
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- JavaScript基础之常用事件
js 基础之常用事件 在js当中,事件是较为常用的内容,本篇文章来说一些常用的事件. 鼠标事件 下面是常用的鼠标事件: click 当用户按下并释放鼠标按键或其他方式"激活"元素时 ...
- Javascript中常用事件集合和事件使用方法
Javascript中常用事件集合和事件使用方法 一.事件绑定 格式: 事件源 . on事件类型=事件处理函数 事件绑定三要素 1.事件源:和谁绑定 2.事件类型:什么事件 3.事件处理函数:触发了要 ...
- javaScript入门之常用事件
JS中的常用事件 onfocus/onblur:聚焦离焦事件,用于表单校验的时候比较合适. onclick/ondblclick:鼠标单击和双击事件 onkeydown/onkeypress:搜索引擎 ...
- jQuery $(document).ready()和JavaScript onload事件
jQuery $(document).ready()和JavaScript onload事件 Why we need a right time? 对元素的操作和事件的绑定需要等待一个合适的时机,可以看 ...
随机推荐
- Lightning Web Components 组合(五)
使用组合我们可以用来设计复杂的组件. 组合一些比较小的组件,可以增加组件的重新性以及可维护性. 通过以下一个简单的demo,将会展示关于owner 以及container 的概念,在实际的项目中 ex ...
- NLP算法工程师(实习生)面试总结(持续更新)
爱奇艺 1. attention<attention is all you need> 2. 相关项目 3. 逻辑回归 4. linux的指令(重命名文件,vim替换,vim指向文章最末行 ...
- 【后缀数组】【LuoguP2408】 不同子串个数
题目链接 题目描述 给你一个长为N的字符串,求不同的子串的个数 我们定义两个子串不同,当且仅当有这两个子串长度不一样 或者长度一样且有任意一位不一样. 子串的定义:原字符串中连续的一段字符组成的字符串 ...
- C语言-----野指针
问题所在 1.局部指针变量没有被初始化 2.使用已经释放过后的指针 3.指针所指向的变量在指针之前被销毁 4.结构体成员指针未初始化, 没有为结构体指针分配足够的内存 ,内存越界(考虑使用柔性数组)和 ...
- 阿里云部署自己的web服务器
阿里云部署自己的web服务器 [外链图片转存失败(img-GIKNTPPx-1564287221547)(https://upload-images.jianshu.io/upload_images/ ...
- MAC 隐藏功能
finder 类: shift+ cmd + G (去指定路径) cmd+↑ (返回) cmd+↓(打开当前选中的文件,如果没有选中的则去选中第一个) cmd+ o (打开当前选中的文件) 以下这些 ...
- [Beta]第一次 Scrum Meeting
[Beta]第一次 Scrum Meeting 写在前面 会议时间 会议时长 会议地点 2019/5/5 22:00 30min 大运村公寓6F寝室 附Github仓库:WEDO 例会照片 工作情况总 ...
- Docker部署web项目-jar包
一.Docker部署web项目-jar包 ①搜索mysql镜像 docker search mysql ②拉取镜像至本地仓库(本文选取的mysql镜像5.7版本) docker pull mysql/ ...
- js十大排序算法收藏
十大经典算法排序总结对比 转载自五分钟学算法&https://www.cnblogs.com/AlbertP/p/10847627.html 一张图概括: 主流排序算法概览 名词解释: n: ...
- 第06组 Alpha冲刺(2/4)
队名:福大帮 组长博客链接:https://www.cnblogs.com/mhq-mhq/p/11885037.html 作业博客 :https://edu.cnblogs.com/campus/f ...