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. Python 3.6 抓取微博m站数据

    Python 3.6 抓取微博m站数据 2019.05.01 更新内容 containerid 可以通过 "107603" + user_id 组装得到,无需请求个人信息获取: 优 ...

  2. rep stos dword ptr es:[edi]

    本文链接:https://blog.csdn.net/ypist/article/details/8467163今天读代码时,忽然跳出如下一条指令==>>汇编代码: rep stos dw ...

  3. Xamarin Forms 实现发送通知点击跳转

    1. Ensure the you have set LaunchMode.SingleTop on your MainActivity: LaunchMode.SingleTop [Activity ...

  4. [RN] React Native 使用 FlatList 实现九宫格布局 GridList

    React Native 使用 FlatList 实现九宫格布局 先看图片演示实例: 本文以图片列表为例,实现九宫格布局! 主要有两种方法: 1)方法一: 利用FlatList的 numColumns ...

  5. HDU 1542.Atlantis-线段树求矩形面积并(离散化、扫描线/线段树)-贴模板

    好久没写过博客了,这学期不是很有热情去写博客,写过的题也懒得写题解.现在来水一水博客,写一下若干年前的题目的题解. Atlantis Time Limit: 2000/1000 MS (Java/Ot ...

  6. ajax post data 获取不到数据，注意 content-type的设置 、post/get(转)

    ajax post  data  获取不到数据,注意 content-type的设置 .post/get 关于 jQuery data 传递数据.网上各种获取不到数据,乱码之类的. 好吧今天我也遇到了 ...

  7. 如何打开 win 10 内置应用

    gpedit.msc windows设置 安全设置 本地策略 安全选项 >> 用户账户控制:用于内置管理员账户的管理员批准模式:已启用

  8. updateprimarykey 和updateprimaryKeySelective

    updateprimarykey 会对左右的字段都进行更新,updateprimaryKeySelective 只会对不为null的字段进行更新..所以在填表的web项目需要注意这个两个方法的选择,因 ...

  9. linux学习（3）：linux常用命令大全

    Linux常用命令大全(非常全!!!) 最近都在和Linux打交道,感觉还不错.我觉得Linux相比windows比较麻烦的就是很多东西都要用命令来控制,当然,这也是很多人喜欢linux的原因,比较短 ...

  10. php 调用微信上传临时素材接口 {“errcode”:41005,”errmsg”:”media data missing hint”}

    原因:由于PHP5.6以前与之后的版本curl_setopt有差异.PHP5.6以后不再支持”@文件路径”的方式. $picPath= "public\public\upload\xxx.p ...