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——常用事件总结的更多相关文章

  1. BOM之JavaScript常用事件

    body, table{font-family: 微软雅黑; font-size: 10pt} table{border-collapse: collapse; border: solid gray; ...

  2. JavaScript常用事件

    一般事件 事件 浏览器支持 描述 onClick HTML: 2 | 3 | 3.2 | 4   Browser: IE3 | N2 | O3 鼠标点击事件,多用在某个对象控制的范围内的鼠标点击 on ...

  3. JavaScript常用事件参考

      onabort 图像加载被中断 onblur 元素失去焦点 onchange 用户改变域的内容 onclick 鼠标点击某个对象 ondblclick 鼠标双击某个对象 onerror 当加载文档 ...

  4. javascript常用事件及方法

    1.获取鼠标坐标,考虑滚动条拖动 var e = event || window.event; var scrollX = document.documentElement.scrollLeft || ...

  5. javascript之常用事件

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. JavaScript基础之常用事件

    js 基础之常用事件 在js当中,事件是较为常用的内容,本篇文章来说一些常用的事件. 鼠标事件 下面是常用的鼠标事件: click 当用户按下并释放鼠标按键或其他方式"激活"元素时 ...

  7. Javascript中常用事件集合和事件使用方法

    Javascript中常用事件集合和事件使用方法 一.事件绑定 格式: 事件源 . on事件类型=事件处理函数 事件绑定三要素 1.事件源:和谁绑定 2.事件类型:什么事件 3.事件处理函数:触发了要 ...

  8. javaScript入门之常用事件

    JS中的常用事件 onfocus/onblur:聚焦离焦事件,用于表单校验的时候比较合适. onclick/ondblclick:鼠标单击和双击事件 onkeydown/onkeypress:搜索引擎 ...

  9. jQuery $(document).ready()和JavaScript onload事件

    jQuery $(document).ready()和JavaScript onload事件 Why we need a right time? 对元素的操作和事件的绑定需要等待一个合适的时机,可以看 ...

随机推荐

  1. cyyz: Day 2 线段树知识整理

    Day 2 上午的听课,哎~昏昏欲睡好吧.. 一.扫描线 知识点: 由于多边形千变万化,要想填充多边形内部的所有像素,需要找到一种合适的规则,能够沿着一个方向,一个像素不漏地把多边形内部填满,同时不污 ...

  2. CSS3 之书页阴影效果

    视觉如下: CSS3 之书页阴影效果: <html> <head> <meta charset="UTF-8"> <title>书页 ...

  3. 「APIO2018」选圆圈

    传送门 Description 有\(n\)个圆,每次找到这些圆中半径最大中的编号最小的圆,删除ta及与其有交集的所有圆. 对于每个圆,求出它是被哪一个圆删除的. Solution  K-D Tree ...

  4. FusionInsight，一个融合的大数据平台

    随着物联网技术和应用的普及,以运营商.互联网以及实体经济行业为代表的企业产生了越来越多的数据,大数据的发展越来越蓬勃. 从2007年开始,大数据应用成为很多企业的需求,2012年兴起并产生了大数据平台 ...

  5. ubuntu之路——day17.1 卷积操作的意义、边缘检测的示例、filter与padding的关系、卷积步长

    感谢吴恩达老师的公开课,以下图片均来自于吴恩达老师的公开课课件 为什么要进行卷积操作? 我们通过前几天的实验已经做了64*64大小的猫图片的识别. 在普通的神经网络上我们在输入层上输入的数据X的维数为 ...

  6. 安装关系型数据库MySQL 安装大数据处理框架Hadoop

    作业要求来自:https://edu.cnblogs.com/campus/gzcc/GZCC-16SE2/homework/3161 1.Hadoop的介绍 Hadoop最早起源于Nutch.Nut ...

  7. js DOM之基础详解

    DOM(文档对象模型)是针对HTML和XML文档的一个API,描绘了一个层次化的节点树,允许开发人员添加.删除和修改页面的某一部分. HTML DOM 树形结构如下: 1.Node方面 1.1 节点类 ...

  8. Unity内存优化之视频讲解

    视频为中文讲解,mp4格式,大小3.05GB 目录   扫码时备注或说明中留下邮箱 付款后如未回复请至https://shop135452397.taobao.com/ 联系店主

  9. deepnude | 福利

    程序好下载github有,但是没有lib,就是没有训练好的model. 以下是搜到的win平台程序的下载链接: magnet:?xt=urn:btih:7BE4EB8D640742D2FFEBD649 ...

  10. 迁移Git项目到Gitlab

    假定Gitlab已经安装, 假定要迁移的Git项目目录为 demo 首先在Gitlab里创建一个新的project, 名称为demo (或者其他名称都可以) 然后在现有的Git项目目录下, 进行以下操 ...