HTML事件大全
html中鼠标滚轮事件onmousewheel的处理方法
html中⿏标滚轮事件onmousewheel的处理⽅法滚轮事件是不同浏览器会有⼀点点区别，⼀个像Firefox使⽤DOMMouseScroll ,ff也可以使⽤addEventListener⽅法绑定DomMouseScroll事件，其他的浏览器滚轮事件使⽤mousewheel，下⾯我来给⼤家具体介绍。
Firefox使⽤DOMMouseScroll，其他的浏览器使⽤mousewheel。
滚动事件触发时Firefox使⽤detail属性捕捉滚轮信息，其他的浏览器使⽤wheelDelta。
不知道为何在该问题上其他⼚商和微软的如此⼀致。
Firefox可以使⽤addEventListener⽅法绑定DomMouseScroll事件。
elem.addEventListener(‘DOMMouseScroll', func, false);IE和其他的主流浏览器可以使⽤传统的事件绑定模型。
但不要使⽤IE专有的attachEvent⽅法，其他主流浏览器并不识别微软的这个⽅法。
Firefox ⿏标滚轮向上滚动是-3，向下滚动是3IE ⿏标滚轮向上滚动是120，向下滚动是-120Safari ⿏标滚轮向上滚动是360，向下滚动是-360Opera ⿏标滚轮向上滚动是120，向下滚动是-120Chrome ⿏标滚轮向上滚动是120，向下滚动是-120有⼈在Safari下做了⼀些测试：”只是滚动⼀圈的话，值为+-0.1，如果滚动地稍微快点的话（多滚动⼏圈），这个值也会变⼤。
这是因为Mac OS下有⿏标滚轮加速功能。
滚动⼀次，浏览器滚动1像素，滚动3次，浏览器却滚动30像素”。
同时他也对Camino（基于Gecko的内核引擎）进⾏研究：“与Safari相似（+- 0.3 to +-Infinity），虽然使⽤了与firefox相同的内核引擎，但结果这个delta值却只在+-2.666666⾥浮动，⽆论滚动速度如何其中经我测试，IE/Opera属于同⼀类型，使⽤attachEvent即可添加滚轮事件。
HTML5+CSS3 视频或音频事件
HTML5+CSS3 视频或音频事件
在页面中，对视频或音频文件进行加载或播放时，会触发一系列事件。
用户可以使用JavaScript 脚本捕捉该事件并进行处理。
事件的捕捉和处理主要使用video标签和audio标签的addEventListener
上述代码中，videoElement表示video标签和audio标签，type表示事件名称，listener表示绑定的函数，useCapture表示事件的响应顺序，是一个布尔值。
2．事件介绍
在使用vide标签与audio标签播放视频或音频文件时，触发的一系列事件介绍如下：
示例：7-8 CatchEvent.html
在上述代码中，为页面添加视频播放和暂停的事件捕捉功能。
当用户单击“播放”按钮播放视频时，会自动捕捉事件。
单击按钮
显示捕捉信息。
HTML鼠标事件
HTML鼠标事件一般事件事件浏览器支持描述onClick HTML: 2 | 3 | 3.2 | 4 Browser: IE3 | N2 | O3 鼠标点击事件，多用在某个对象控制的范围内的鼠标点击 onDblClick HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N4 | O 鼠标双击事件onMouseDown HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N4 | O 鼠标上的按钮被按下了onMouseUp HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N4 | O 鼠标按下后，松开时激发的事件onMouseOver HTML: 2 | 3 | 3.2 | 4 Browser: IE3 | N2 | O3 当鼠标移动到某对象范围的上方时触发的事件 onMouseMove HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N4 | O 鼠标移动时触发的事件onMouseOut HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N3 | O3 当鼠标离开某对象范围时触发的事件onKeyPress HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N4 | O 当键盘上的某个键被按下并且释放时触发的事件.[注意:页面内必须有被聚焦的对象]onKeyDown HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N4 | O 当键盘上某个按键被按下时触发的事件[注意:页面内必须有被聚焦的对象] onKeyUp HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N4 | O 当键盘上某个按键被按放开时触发的事件[注意:页面内必须有被聚焦的对象] 页面相关事件事件浏览器支持描述onAbort HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N3 | O 图片在下载时被用户中断onBeforeUnload HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | O 当前页面的内容将要被改变时触发的事件onError HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N3 | O 捕抓当前页面因为某种原因而出现的错误，如脚本错误与外部数据引用的错误onLoad HTML: 2 | 3 | 3.2 | 4 Browser: IE3 | N2 | O3 页面内空完成传送到浏览器时触发的事件，包括外部文件引入完成onMove HTML: 2 | 3 | 3.2 | 4 Browser: IE | N4 | O 浏览器的窗口被移动时触发的事件onResize HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N4 | O 当浏览器的窗口大小被改变时触发的事件onScroll HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | O 浏览器的滚动条位置发生变化时触发的事件onStop HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 浏览器的停止按钮被按下时触发的事件或者正在下载的文件被中断onUnload HTML: 2 | 3 | 3.2 | 4 Browser: IE3 | N2 | O3 当前页面将被改变时触发的事件表单相关事件事件浏览器支持描述onBlur HTML: 2 | 3 | 3.2 | 4 Browser: IE3 | N2 | O3 当前元素失去焦点时触发的事件 [鼠标与键盘的触发均可] onChange HTML: 2 | 3 | 3.2 | 4 Browser: IE3 | N2 | O3 当前元素失去焦点并且元素的内容发生改变而触发的事件 [鼠标与键盘的触发均可]onFocus HTML: 2 | 3 | 3.2 | 4 Browser: IE3 | N2 | O3 当某个元素获得焦点时触发的事件onReset HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N3 | O3 当表单中RESET的属性被激发时触发的事件onSubmit HTML: 2 | 3 | 3.2 | 4 Browser: IE3 | N2 | O3 一个表单被递交时触发的事件滚动字幕事件事件浏览器支持描述onBounce HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | O 在Marquee 内的内容移动至Marquee显示范围之外时触发的事件onFinish HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | O 当Marquee 元素完成需要显示的内容后触发的事件onStart HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | O 当Marquee 元素开始显示内容时触发的事件编辑事件事件浏览器支持描述onBeforeCopy HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当页面当前的被选择内容将要复制到浏览者系统的剪贴板前触发的事件onBeforeCut HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当页面中的一部分或者全部的内容将被移离当前页面[剪贴]并移动到浏览者的系统剪贴板时触发的事件onBeforeEditFocus HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当前元素将要进入编辑状态onBeforePaste HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 内容将要从浏览者的系统剪贴板传送[粘贴]到页面中时触发的事件onBeforeUpdate HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当浏览者粘贴系统剪贴板中的内容时通知目标对象onContextMenu HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当浏览者按下鼠标右键出现菜单时或者通过键盘的按键触发页面菜单时触发的事件[试试在页面中的中加入onContentMenu="return false"就可禁止使用鼠标右键了] onCopy HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当页面当前的被选择内容被复制后触发的事件onCut HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当页面当前的被选择内容被剪切时触发的事件onDrag HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当某个对象被拖动时触发的事件 [活动事件]onDragDrop HTML: 2 | 3 | 3.2 | 4 Browser: IE | N4 | O 一个外部对象被鼠标拖进当前窗口或者帧onDragEnd HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当鼠标拖动结束时触发的事件，即鼠标的按钮被释放了 onDragEnter HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当对象被鼠标拖动的对象进入其容器范围内时触发的事件 onDragLeave HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当对象被鼠标拖动的对象离开其容器范围内时触发的事件onDragOver HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当某被拖动的对象在另一对象容器范围内拖动时触发的事件 [活动事件]onDragStart HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | O 当某对象将被拖动时触发的事件onDrop HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 在一个拖动过程中，释放鼠标键时触发的事件onLoseCapture HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当元素失去鼠标移动所形成的选择焦点时触发的事件 onPaste HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当内容被粘贴时触发的事件onSelect HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | O 当文本内容被选择时的事件onSelectStart HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | O 当文本内容选择将开始发生时触发的事件数据绑定事件浏览器支持描述onAfterUpdate HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | O 当数据完成由数据源到对象的传送时触发的事件 onCellChange HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当数据来源发生变化时onDataAvailable HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | O 当数据接收完成时触发事件onDatasetChanged HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | O 数据在数据源发生变化时触发的事件 onDatasetComplete HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | O 当来子数据源的全部有效数据读取完毕时触发的事件 onErrorUpdate HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | O 当使用onBeforeUpdate事件触发取消了数据传送时，代替onAfterUpdate事件onRowEnter HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当前数据源的数据发生变化并且有新的有效数据时触发的事件onRowExit HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当前数据源的数据将要发生变化时触发的事件 onRowsDelete HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当前数据记录将被删除时触发的事件onRowsInserted HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当前数据源将要插入新数据记录时触发的事件外部事件事件浏览器支持描述onAfterPrint HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当文档被打印后触发的事件onBeforePrint HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当文档即将打印时触发的事件onFilterChange HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | O 当某个对象的滤镜效果发生变化时触发的事件onHelp HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | O 当浏览者按下F1或者浏览器的帮助选择时触发的事件 onPropertyChange HTML: 2 | 3 | 3.2 | 4 Browser: IE5 | N | O 当对象的属性之一发生变化时触发的事件 onReadyStateChange HTML: 2 | 3 | 3.2 | 4 Browser: IE4 | N | O 当对象的初始化属性值发生变化时触发/yunfan555/article/details/2568437。
html中input：text文本框事件使用
html中input：text⽂本框事件使⽤之前在⽹上看到⼀个题⽬；原题如下：请⽤实现⼀个最简单的输⼊框提⽰功能：要求：1.输⼊框内默认显⽰提⽰⽂案，当⽤户点击输⼊框后，光标定位到输⼊框最前，并继续显⽰提⽰⽂案，当⽤户输⼊后替换默认提⽰⽂案，当⽤户清空输⼊框后从新显⽰默认提⽰⽂案2.要求⽀持ie（6，7，8，9），firefox，chrome等浏览器3.请写出html结构，javascript代码逻辑部分写出实现思路即可（有时间能写出代码者最佳，可以使⽤js库）由于在解答该题⽬的过程中遇到了⼀些兼容性问题，就记录了下来。
CSS3中可以直接使⽤input:text的placeholder属性实现对应的功能。
相对于其他的浏览器，我的答案如下：DOM结构<div><label for="inputText">⽤户名</label><input style="height: 30px;width: 200px" type="text" name="inputText" data-default-value="请输⼊⽤户名" id="inputText"value='请输⼊⽤户名'/></div>这⾥⽤到的⼏个事件如下：onpropertychange（IE独有）,oninput（W3C），也许别的解决⽅案还⽤到了其他事件，希望到时能够通过评论⽅式将代码共享。
注意：oninput事件只有通过addEventListener的⽅式绑定才会⽣效。
javascript代码如下：var inputText = document.getElementById('inputText');var iniStart = -1;console.log(myData.dataset);inputText.onclick = function (e) {// console.log(this);setCaretPosition(this, 0);};if (inputText.onpropertychange) {inputText.onpropertychange = function () {console.log(this.value);if (this.value.trim().length == 0) {this.value = "请输⼊⽤户名";}};} else {inputText.addEventListener('input', function () {if (iniStart == -1) {this.value = this.value.replace('请输⼊⽤户名', "");iniStart++;} else if (this.value.trim().length == 0) {this.value = this.dataset.defaultValue;iniStart = -1;setCaretPosition(this, 0)}}, false);}function getCursortPosition(ctrl) {//获取光标位置函数var CaretPos = 0; // IE Supportif (document.selection) {ctrl.focus();var Sel = document.selection.createRange();Sel.moveStart('character', -ctrl.value.length);CaretPos = Sel.text.length;}// Firefox supportelse if (ctrl.selectionStart || ctrl.selectionStart == '0')CaretPos = ctrl.selectionStart;return (CaretPos);}function setCaretPosition(ctrl, pos) {//设置光标位置函数if (ctrl.setSelectionRange) {ctrl.focus();ctrl.setSelectionRange(pos, pos);}else if (ctrl.createTextRange) {var range = ctrl.createTextRange();range.collapse(true);range.moveEnd('character', pos);range.moveStart('character', pos);range.select();}}其中setCaretPosition函数主要⽤来设置input中当前光标的位置。
HTML所有事件
超链接事件：<a herf="#"onclick="javascript:if(window.confirm('退出此窗口！你确定吗？')){windows.close);}">退出</a>一般事件:onClick HTML:鼠标点击事件，多用在某个对象控制的范围内的鼠标点击onDblClick HTML:鼠标双击事件onMouseDown HTML:鼠标上的按钮被按下了onMouseUp HTML:鼠标按下后，松开时激发的事件onMouseOver HTML:当鼠标移动到某对象范围的上方时触发的事件onMouseMove HTML:鼠标移动时触发的事件onMouseOut HTML:当鼠标离开某对象范围时触发的事件onKeyPress HTML:当键盘上的某个键被按下并且释放时触发的事件.[注意:页面内必须有被聚焦的对象]onKeyDown HTML:当键盘上某个按键被按下时触发的事件[注意:页面内必须有被聚焦的对象]onKeyUp HTML:当键盘上某个按键被按放开时触发的事件[注意:页面内必须有被聚焦的对象]页面相关事件:onAbort HTML:图片在下载时被用户中断onBeforeUnload HTML:当前页面的内容将要被改变时触发的事件onError HTML:捕抓当前页面因为某种原因而出现的错误，如脚本错误与外部数据引用的错误onLoad HTML:页面内空完成传送到浏览器时触发的事件，包括外部文件引入完成onMove HTML:浏览器的窗口被移动时触发的事件onResize HTML:当浏览器的窗口大小被改变时触发的事件onScroll HTML:浏览器的滚动条位置发生变化时触发的事件onStop HTML:浏览器的停止按钮被按下时触发的事件或者正在下载的文件被中断onUnload HTML:当前页面将被改变时触发的事件表单相关事件:onPropertyChange:文本框改变事件onBlur HTML:当前元素失去焦点时触发的事件[鼠标与键盘的触发均可]onChange HTML:当前元素失去焦点并且元素的内容发生改变而触发的事件[鼠标与键盘的触发均可]onFocus HTML:当某个元素获得焦点时触发的事件onReset HTML:当表单中RESET的属性被激发时触发的事件onSubmit HTML:一个表单被递交时触发的事件滚动字幕事件:onBounce HTML:在Marquee内的内容移动至Marquee显示范围之外时触发的事件onFinish HTML:当Marquee元素完成需要显示的内容后触发的事件onStart HTML:当Marquee元素开始显示内容时触发的事件编辑事件:onBeforeCopy HTML:当页面当前的被选择内容将要复制到浏览者系统的剪贴板前触发的事件onBeforeCut HTML:当页面中的一部分或者全部的内容将被移离当前页面[剪贴]并移动到浏览者的系统剪贴板时触发的事件onBeforeEditFocus HTML:当前元素将要进入编辑状态onBeforePaste HTML:内容将要从浏览者的系统剪贴板传送[粘贴]到页面中时触发的事件onBeforeUpdate HTML:当浏览者粘贴系统剪贴板中的内容时通知目标对象onContextMenu HTML:当浏览者按下鼠标右键出现菜单时或者通过键盘的按键触发页面菜单时触发的事件[试试在页面中的中加入onContentMenu="return false"就可禁止使用鼠标右键了]onCopy HTML:当页面当前的被选择内容被复制后触发的事件onCut HTML:当页面当前的被选择内容被剪切时触发的事件onDrag HTML:当某个对象被拖动时触发的事件[活动事件]onDragDrop HTML:一个外部对象被鼠标拖进当前窗口或者帧onDragEnd HTML:当鼠标拖动结束时触发的事件，即鼠标的按钮被释放了onDragEnter HTML:当对象被鼠标拖动的对象进入其容器范围内时触发的事件onDragLeave HTML:当对象被鼠标拖动的对象离开其容器范围内时触发的事件onDragOver HTML:当某被拖动的对象在另一对象容器范围内拖动时触发的事件[活动事件]onDragStart HTML:当某对象将被拖动时触发的事件onDrop HTML:在一个拖动过程中，释放鼠标键时触发的事件onLoseCapture HTML:当元素失去鼠标移动所形成的选择焦点时触发的事件onPaste HTML:当内容被粘贴时触发的事件onSelect HTML:当文本内容被选择时的事件onSelectStart HTML:当文本内容选择将开始发生时触发的事件数据绑定:onAfterUpdate HTML:当数据完成由数据源到对象的传送时触发的事件onCellChange HTML:当数据来源发生变化时onDataAvailable HTML:当数据接收完成时触发事件onDatasetChanged HTML:数据在数据源发生变化时触发的事件onDatasetComplete HTML:当来子数据源的全部有效数据读取完毕时触发的事件onErrorUpdate HTML:当使用onBeforeUpdate事件触发取消了数据传送时，代替onAfterUpdate事件onRowEnter HTML:当前数据源的数据发生变化并且有新的有效数据时触发的事件onRowExit HTML:当前数据源的数据将要发生变化时触发的事件onRowsDelete HTML:当前数据记录将被删除时触发的事件onRowsInserted HTML:当前数据源将要插入新数据记录时触发的事件外部事件:onAfterPrint HTML:当文档被打印后触发的事件onBeforePrint HTML:当文档即将打印时触发的事件onFilterChange HTML:当某个对象的滤镜效果发生变化时触发的事件onHelp HTML:当浏览者按下F1或者浏览器的帮助选择时触发的事件onPropertyChange HTML:当对象的属性之一发生变化时触发的事件onReadyStateChange HTML:当对象的初始化属性值发生变化时触发的事件。
HTML5--新增表单元素属性事件（3）
HTML5--新增表单元素属性事件（3）前⾔： HTML5在原本已有表单元素的基础上新增了新的表单元素和属性，增强了表单元素的功能。
第⼀类.新增input(type)类型 1.type为email 作⽤：email 类型⽤于包含 email 地址的输⼊域。
特性：提供了默认电⼦邮箱的完整验证：要求必须包含@符号，同时必须包含服务器名称，如果不能满⾜验证，则会阻⽌当前的表单提交 email⽰例：如果内容不满⾜邮箱格式，提交表单会有错误提⽰信息。
<body><form action="#">邮箱:<input type="email"><input type="submit" value="提交"></form></body> 2.type为url 作⽤：url类型⽤于包含⽹址的输⼊域。
特性：提供了⽹址完整验证，只能输⼊合法的⽹址：必须包含http://(例:) url⽰例：如果内容不满⾜⽹址格式，提交表单会有错误提⽰信息。
<body><form action="#">⽹址:<input type="url"><input type="submit" value="提交"></form></body> 3.type为number 作⽤：number 类型⽤于包含数值的输⼊域。
特性：只能输⼊数字(包含⼩数点)，不能输⼊其它的字符 属性： max -- 限制输⼊框的最⼤值 min -- 限制输⼊框的最⼩值 value -- 输⼊框的默认值 step -- 规定数字增长间隔 number⽰例：输⼊框中只能输⼊number类型值，不能输⼊其他类型的值<form action="#">数量：<input type="number" value="60" max="100" min="0" step="3"><br><input type="submit" value="提交"></form> 4.type为search 作⽤：search 类型⽤于搜索域，⽐如站点搜索或 Google 搜索 特性：输⼊值后，输⼊框后带有关闭按钮可以清除输⼊框内容 search⽰例：<body><form action="#">请输⼊商品名称：<input type="search"> <br><input type="submit" value="提交"></form></body> 5.type为range 作⽤：range 类型⽤于包含⼀定范围内数字值的输⼊域(可以⽤作⾳量键) 特性：显⽰为滑动条 属性： max -- 允许的最⼤值 min -- 允许的最⼩值 value -- 规定的默认值 step -- 规定数字增长间隔 range⽰例：<body><form action="#">范围：<input type="range" max="100" min="0" value="50"> <br><input type="submit" value="提交"></form></body> 6.type为color 作⽤：输⼊类型⽤于规定颜⾊ 特性：该类型允许你从拾⾊器中选取颜⾊ color⽰例：<body><form action="#">颜⾊：<input type="color"> <br><input type="submit" value="提交"></form></body> 7.type为tel 作⽤：tel 输⼊类型⽤于包含电话号码的输⼊字段 特性：tel它并不是来实现验证。
html5storage事件
html5storage事件HTML5 虽然很多年了，但是真的了解不不够不够。
主题说的是 storage时间，说起对 storage 事件的了解还是从说起。
当前想法是如下，可是怎么想都⽐较low啊。
1. 存⼊ localStorage 或者 indexedDB⾥⾯，然后定期读取呢？2. socket开启呢？3. 中间服务中转呢？曾有同事偶然间提到到storage事件，当时也上⼼。
前两天⽆意中看到⼀篇的⽂章。
顺便再去探究⼀下 QQ⾳乐。
点击播放歌曲的时候，在player.html页⾯即播放页⾯捕获的数据。
这就完全验证了 QQ⾳乐这个添加⾳乐的实现就是基于 storage事件来完成的。
那么我们先来看⼀下， storage event的定义。
简单就是说 session storage 和 local storage 的值变化的时候，会触发该事件。
The event is fired on a 's object when a storage area changes, as described in the previous two sections (, ).When a user agent is to send a storage notification for a , the user agent must to named at the object's object, using .怎么使⽤呢：A页⾯window.addEventListener("storage", function (e) {console.log(e)});B 页⾯localStorage.setItem('key1', 'vakue1')B页⾯执⾏这段代码的时候， A页⾯就会打出e整个对象。
我们看⼀下e究竟有哪些属性或者⽅法，注意标红的五个属性，其实的都是普通事件都有的属性， key: 不⽤解释，更新的属性名newValue: 新值oldValue : 旧值storageArea: 我这⾥理解就是localStorage的值url: 触发该事件的⽹址这⾥有两点：1. 当localStorage调⽤ setItem, removeItem ,clear⽅法的时候，调⽤的页⾯本⾝是不会触发storage事件的。
HTML事件属性
onloadedmetadata H5
script
当元数据（比如分辨率和时长）被加载时运行的脚本。
onloadstart H5
script
在文件开始加载且未实际加载任何数据前运行的脚本。
onpause H5
script
当媒介被用户或程序暂停时运行的脚本。
onplay H5
script
每当音量改变时（包括将音量设置为静音）时运行的脚本。
onwaiting
script
当媒介已停止播放但打算继续播放时（比如当媒介暂停已缓冲更多数据）运行脚本
HTML 全局属性
HTML 5 视频/音频参考手册
script
当媒介已就绪可以开始播放时运行的脚本。
onplaying H5
script
当媒介已开始播放时运行的脚本。
onprogress H5
script
当浏览器正在获取媒介数据时运行的脚本。
onratechange H5
script
每当回放速率改变时运行的脚本（比如当用户切换到慢动作或快进模式）。
onabort
script
在退出时运行的脚本。
oncanplay H5
script
当文件就绪可以开始播放时运行的脚本（缓冲已足够开始时）。
oncanplaythrough H5
script
当媒介能够无需因缓冲而停止即可播放至结尾时运行的脚本。
ondurationchange H5
script
当媒介长度改变时运行的脚本。
script
当上下文菜单被触发时运行的脚本。
onfocus
script
Html事件列表
Html事件列表*一般事件:**onClick HTML: 鼠标点击事件，多用在某个对象控制的范围内的鼠标点击*onDblClick HTML: 鼠标双击事件*onMouseDown HTML: 鼠标上的按钮被按下了*onMouseUp HTML: 鼠标按下后，松开时激发的事件**onMouseOver HTML: 当鼠标移动到某对象范围的上方时触发的事件*onMouseMove HTML: 鼠标移动时触发的事件**onMouseOut HTML: 当鼠标离开某对象范围时触发的事件*onKeyPress HTML: 当键盘上的某个键被按下并且释放时触发的事件. [注意:页面内必须有被聚焦的对象]*onKeyDown HTML: 当键盘上某个按键被按下时触发的事件[注意:页面内必须有被聚焦的对象]*onKeyUp HTML: 当键盘上某个按键被按放开时触发的事件[注意:页面内必须有被聚焦的对象]页面相关事件:onAbort HTML: 图片在下载时被用户中断onBeforeUnload HTML: 当前页面的内容将要被改变时触发的事件onError HTML: 捕抓当前页面因为某种原因而出现的错误，如脚本错误与外部数据引用的错误*onLoad HTML: 页面内空完成传送到浏览器时触发的事件，包括外部文件引入完成onMove HTML: 浏览器的窗口被移动时触发的事件onResize HTML: 当浏览器的窗口大小被改变时触发的事件onScroll HTML: 浏览器的滚动条位置发生变化时触发的事件onStop HTML: 浏览器的停止按钮被按下时触发的事件或者正在下载的文件被中断*onUnload HTML: 当前页面将被改变时触发的事件表单相关事件:*onBlur HTML: 当前元素失去焦点时触发的事件[鼠标与键盘的触发均可]*onChange HTML: 当前元素失去焦点并且元素的内容发生改变而触发的事件 [鼠标与键盘的触发均可]*onFocus HTML: 当某个元素获得焦点时触发的事件*onReset HTML: 当表单中RESET的属性被激发时触发的事件*onSubmit HTML: 一个表单被递交时触发的事件滚动字幕事件:onBounce HTML: 在Marquee内的内容移动至Marquee显示范围之外时触发的事件onFinish HTML: 当Marquee元素完成需要显示的内容后触发的事件onStart HTML: 当Marquee元素开始显示内容时触发的事件编辑事件:onBeforeCopy HTML:当页面当前的被选择内容将要复制到浏览者系统的剪贴板前触发的事件onBeforeCut HTML: 当页面中的一部分或者全部的内容将被移离当前页面[剪贴]并移动到浏览者的系统剪贴板时触发的事件onBeforeEditFocus HTML: 当前元素将要进入编辑状态onBeforePaste HTML: 内容将要从浏览者的系统剪贴板传送[粘贴]到页面中时触发的事件onBeforeUpdate HTML: 当浏览者粘贴系统剪贴板中的内容时通知目标对象onContextMenu HTML: 当浏览者按下鼠标右键出现菜单时或者通过键盘的按键触发页面菜单时触发的事件[试试在页面中的中加入onContentMenu="return false"就可禁止使用鼠标右键了]onCopy HTML: 当页面当前的被选择内容被复制后触发的事件onCut HTML: 当页面当前的被选择内容被剪切时触发的事件onDrag HTML: 当某个对象被拖动时触发的事件 [活动事件] onDragDrop HTML: 一个外部对象被鼠标拖进当前窗口或者帧onDragEnd HTML:当鼠标拖动结束时触发的事件，即鼠标的按钮被释放了onDragEnter HTML: 当对象被鼠标拖动的对象进入其容器范围内时触发的事件onDragLeave HTML: 当对象被鼠标拖动的对象离开其容器范围内时触发的事件onDragOver HTML: 当某被拖动的对象在另一对象容器范围内拖动时触发的事件 [活动事件]onDragStart HTML: 当某对象将被拖动时触发的事件onDrop HTML: 在一个拖动过程中，释放鼠标键时触发的事件onLoseCapture HTML: 当元素失去鼠标移动所形成的选择焦点时触发的事件onPaste HTML: 当内容被粘贴时触发的事件onSelect HTML: 当文本内容被选择时的事件onSelectStart HTML当文本内容选择将开始发生时触发的事件数据绑定:onAfterUpdate HTML: 当数据完成由数据源到对象的传送时触发的事件onCellChange HTML:当数据来源发生变化时onDataAvailable HTML: 当数据接收完成时触发事件onDatasetChanged HTML: 数据在数据源发生变化时触发的事件onDatasetComplete HTML: 当来子数据源的全部有效数据读取完毕时触发的事件onErrorUpdate HTML: 当使用onBeforeUpdate事件触发取消了数据传送时，代替onAfterUpdate事件onRowEnter HTML:当前数据源的数据发生变化并且有新的有效数据时触发的事件onRowExit HTML:当前数据源的数据将要发生变化时触发的事件onRowsDelete HTML: 当前数据记录将被删除时触发的事件onRowsInserted HTML: 当前数据源将要插入新数据记录时触发的事件外部事件:onAfterPrint HTML: 当文档被打印后触发的事件onBeforePrint HTML: 当文档即将打印时触发的事件onFilterChange HTML: 当某个对象的滤镜效果发生变化时触发的事件onHelp HTML: 当浏览者按下F1或者浏览器的帮助选择时触发的事件onPropertyChange HTML: 当对象的属性之一发生变化时触发的事件onReadyStateChange HTML: 当对象的初始化属性值发生变化时触发的事件。
htmlselect的事件方法属性
htmlselect的事件⽅法属性事件当对象设置为时触发。
当成功更新数据源对象中的关联对象后在数据绑定对象上触发。
对象要被设置为当前元素前⽴即触发。
当选中区从⽂档中删除之前在源对象触发。
在从当前对象变为⽗⽂档其它对象之前⽴即触发。
在包含于可编辑元素内的对象进⼊⽤户界⾯激活状态前或可编辑容器变成控件选中区前触发。
在选中区从系统剪贴板粘贴到⽂档前在⽬标对象上触发。
当成功更新数据源对象中的关联对象前在数据绑定对象上触发。
在对象失去输⼊焦点时触发。
当对象或选中区的内容改变时触发。
在⽤户⽤⿏标左键单击对象时触发。
在⽤户使⽤⿏标右键单击客户区打开上下⽂菜单时触发。
当⽤户将要对该对象制作⼀个控件选中区时触发。
当对象或选中区从⽂档中删除并添加到系统剪贴板上时在源元素上触发。
当⽤户双击对象时触发。
当 activeElement 从当前对象变为⽗⽂档其它对象时触发。
当⽤户拖曳对象到⼀个合法拖曳⽬标时在⽬标元素上触发。
当⽤户在拖曳操作过程中将⿏标移出合法拖曳⽬标时在⽬标对象上触发。
当⽤户拖曳对象划过合法拖曳⽬标时持续在⽬标元素上触发。
当⿏标按钮在拖曳操作过程中释放时在⽬标对象上触发。
更新数据源对象中的关联数据出错时在数据绑定对象上触发。
当对象获得焦点时触发。
当元素将要被设置为焦点之前触发。
在移动焦点到其它元素之后⽴即触发于当前拥有焦点的元素上触发。
当⽤户在浏览器为当前窗⼝时按 F1 键时触发。
当⽤户按下键盘按键时触发。
当⽤户按下字⾯键时触发。
当⽤户释放键盘按键时触发。
当对象失去⿏标捕捉时触发。
当⽤户⽤任何⿏标按钮单击对象时触发。
当⽤户将⿏标指针移动到对象内时触发。
当⽤户将⿏标指针移出对象边界时触发。
当⽤户将⿏标划过对象时触发。
当⽤户将⿏标指针移出对象边界时触发。
当⽤户将⿏标指针移动到对象内时触发。
当⽤户在⿏标位于对象之上时释放⿏标按钮时触发。
当⿏标滚轮按钮旋转时触发。
当对象移动时触发。
当对象停⽌移动时触发。
当对象开始移动时触发。
HTMLINPUT详细属性方法事件介绍
HTML_IN PUT 详细属性方法事件ACCESSK EY accessK ey 设置或获取对象的快捷键。
ATOMICS ELECTI ON 指定元素及其内容是否可以一不可见单位统一选择。
AUTOCOM PLETEautocom plete设置或获取对象的自动完成状态。
BEGIN begin 设置或获取时间线在该元素上播放前的延迟时间。
canHave Childr en 获取表明对象是否可以包含子对象的值。
canHave HTML 获取表明对象是否可以包含丰富的HTML 标签的值。
CLASS classNa me 设置或获取对象的类。
clientH eight获取对象的高度，不计算任何边距、边框、滚动条或可能应用到该对象的补白。
clientL eft 获取 offsetL eft 属性和客户区域的实际左边之间的距离。
clientT op 获取 offsetT op 属性和客户区域的实际顶端之间的距离。
clientW idth 获取对象的宽度，不计算任何边距、边框、滚动条或可能应用到该对象的补白。
CONTENT EDITAB LE content Editab le 设置或获取表明用户是否可编辑对象内容的字符串。
DATAFLD dataFld设置或获取由dataSrc属性指定的绑定到指定对象的给定数据源的字段。
DATASRC dataSrc设置或获取用于数据绑定的数据源。
default Value设置或获取对象的初始内容。
DIR dir 设置或获取对象的阅读顺序。
disable d 获取表明用户是否可与该对象交互的值。
DISABLE D disable d 设置或获取控件的状态。
END end 设置或获取表明元素结束时间的值，或者元素设置为重复的简单持续终止时间。
【HTML5】HTML5中video元素事件详解（实时监测当前播放时间）
【HTML5】HTML5中video元素事件详解（实时监测当前播放时间）html 代码。
video后边⼏个元素，可处理ios 系统的兼容性<video id="myVideo" controls="controls" poster='预览图' preload="auto" x5-playsinline="" playsinline="" webkit-playsinline="" ><source src="" type="video/mp4"></video>js 代码<script>//获取视频DOM元素var myVideo = document.getElementById("myVideo");myVideo.oncanplay = function(){console.log("准备就绪");};//监听播放开始myVideo.addEventListener('play',function(){console.log("开始播放");});//监听播放结束myVideo.addEventListener('pause',function(){console.log("播放暂停");});//监听播放结束myVideo.addEventListener('ended',function(){console.log("播放结束");});//使⽤事件监听⽅式捕捉事件，此事件可作为实时监测video 播放状态myVideo.addEventListener("timeupdate",function(){var timeDisplay;//⽤秒数来显⽰当前播放进度timeDisplay = Math.floor(myVideo.currentTime);console.log(Math.floor(myVideo.currentTime))//当视频播放到 4s的时候做处理if(timeDisplay == 4){//处理代码}},false);</script>事件介绍事件描述loadstart浏览器开始在⽹上寻找媒体数据progress浏览器正在获取媒体数据suspend浏览器暂停获取媒体数据，但是下载过程并滑正常结束abort浏览器在下载完全部媒体数据之前中⽌获取媒体数据，但是并不是由错误引起的error获取媒体数据过程中出错video元素或audio元素所在⽹络突然变为未初始化状态可能原因有两个:1.载⼊媒体过程中突然发⽣⼀个致命错误emptied2.在浏览器正在选择⽀持的播放格式时，⼜调⽤了load⽅法重新载⼊媒体stalled浏览器尝试获取媒体数据失败play即将开始播放，当执⾏了play⽅法时触发，或数据下载后元素被设为autoplay属性pause播放暂停，当执⾏了pause⽅式时触发loadedmetadata浏览器获取完毕媒体的时间长和字节数waiting播放过程由于得不到下⼀帧⽽暂停播放（例如下⼀帧尚未加载完毕），但很快就能够得到下⼀帧canplay浏览器能够播放媒体，但估计以当前的播放速率不能直接播放完毕，播放期间需要缓冲canplaythrough浏览器能够播放媒体，⽽且以当前播放速率能够将媒体播放完毕，不再需要进⾏缓冲seeking seeking属性变为true，浏览器正在请求数据seeked seeking属性变为false，浏览器停⽌请求数据timeupdate由于播放位置被改变，可能是播放过程中的⾃然改变，也可能是被⼈为的改变，或由于播放不能连续⽽发⽣的跳变ended播放结束后停⽌播放ratechange defaultplaybackRate属性（默认播放速率）或playbackRate属性（当前播放速率）被改变druationchange播放时长被改变volumechange volume属性（⾳量）被改变或muted属性（静⾳状态）被改变。
HTML5触摸事件演化tap事件
HTML5触摸事件演化tap事件触摸事件是移动浏览器特有的HTML5事件，虽然click事件在pc和移动端更通⽤，但是在移动端会出现300ms延迟，较为影响⽤户体验，300ms延迟来⾃判断双击和长按，因为只有默认等待时间结束以确定没有后续动作发⽣时，才会触发click事件。
所以触摸事件反应更快，体验更好。
触摸事件的类型：为了区别触摸相关的状态改变，存在多种类型的触摸事件。
可以通过检查触摸事件的属性来确定当前事件属于哪种类型。
注意: 在很多情况下，触摸事件和⿏标事件会同时被触发（⽬的是让没有对触摸设备优化的代码仍然可以在触摸设备上正常⼯作）。
如果你使⽤了触摸事件，可以调⽤来阻⽌⿏标事件被触发。
标准的触摸事件事件名称描述包含touches数组touchstart当⽤户在触摸平⾯上放置了⼀个触点时触发。
事件的⽬标element将是触点位置上的那个⽬标element是touchmove 当⽤户在触摸平⾯上移动触点时触发。
事件的⽬标element和这个 touchmove 事件对应的touchstart 事件的⽬标element相同，哪怕当touchmove事件触发时，触点已经移出了该element。
是touchend 当⼀个触点被⽤户从触摸平⾯上移除（当⽤户将⼀个⼿指离开触摸平⾯）时触发。
当触点移出触摸平⾯的边界时也将触发。
例如⽤户将⼿指划出屏幕边缘。
已经被从触摸平⾯上移除的触点，可以在changedTouches 属性定义的 TouchList中找到。
是touchenter当触点进⼊某个element时触发。
此事件没有冒泡过程。
是touchleave当触点离开某个element时触发。
此事件没有冒泡过程。
是touchcancel 当触点由于某些原因被中断时触发。
有⼏种可能的原因如下（具体的原因根据不同的设备和浏览器有所不同）：由于某个事件取消了触摸：例如触摸过程被⼀个模态的弹出框打断。
触点离开了⽂档窗⼝，⽽进⼊了浏览器的界⾯元素、插件或者其他外部内容区域。
HTML事件的种类
}
</script>
效果为：
水平滚动距离：0
垂直滚动距离：0
本例在IE浏览器中无效。
<body onload="处理程序">
如：
<body onload="alert('欢迎光临！')">
unload事件在页面卸载时发生，如单击超链接打开另一个页面、使用前进/后退按钮、关闭浏览器窗口时会触发该事件。
unload事件也是由window对象处理的，一般也在<body>标签中调用：
<body onunload="处理程序">
浏览器窗口的scroll事件在<body>标签中调用：
<body onscroll="处理程序">
事件发生后，body对象的scrollLeft属性保存了窗口水平方向的滚动距离，scrollTop属性保存了窗口垂直方向的滚动距离。
例如：
<body onscroll="getScroll()">
<div id="bleft"> </div>
change：用户改变文本框中的文本时发生，用户改变了列表框中选择的项目时发生。
submit：用户点击提交按钮时在表单上发生。
reset：用户点击重置按钮时在表单上发生。
resize：窗口或框架的大小发生改变时发生。
列举html中常见的事件类型
列举html中常见的事件类型
正文:
在HTML中，事件是指用户与网页元素进行交互或执行特定操作时触发的动作或行为。
HTML中常见的事件类型有很多，下面列举了一些常见的事件类型：
1. 点击事件（click）：当用户点击某个元素时触发，可以用于实现按钮点击、链接跳转等功能。
2. 鼠标移动事件（mousemove）：当用户移动鼠标时触发，可以用于实现鼠标悬停、鼠标跟随等效果。
3. 键盘事件（keydown、keyup）：当用户按下或释放键盘上的按键时触发，可以用于实现键盘快捷键、表单输入验证等功能。
4. 表单事件（submit、change）：当用户提交表单或表单元素的值发生改变时触发，可以用于实现表单验证、数据提交等功能。
5. 页面加载事件（load）：当网页完全加载并显示给用户时触发，可以用于实现页面初始化、数据加载等操作。
6. 鼠标滚轮事件（mousewheel）：当用户使用鼠标滚轮滚动页面时触发，可以用于实现页面滚动、图片轮播等效果。
7. 元素拖拽事件（drag、drop）：当用户拖拽元素时触发，可以用于实现元素拖拽、排序等功能。
8. 触摸事件（touchstart、touchmove、touchend）：当用户使用触摸屏设备进行触摸操作时触发，可以用于实现手势操作、移动端交互等功能。
除了上述列举的常见事件类型，HTML还提供了更多的事件类型，如窗口大小改变事件、音频视频播放事件等。
通过监听这些事件，我们可以实现丰富的交互效果和功能。
在实际开发中，我们可以通过JavaScript来编写事件处理函数，实现对事件的响应和处理。
详解Html5关于拖拽（Drag和drop）的使用和事件
详解Html5关于拖拽（Drag和drop）的使⽤和事件拖放（Drag 和 drop）是 HTML5 标准的组成部分。
在 HTML5 中，拖放是标准的⼀部分，任何元素都能够拖放。
1. 相关事件drag拖动元素或选择⽂本时触发此事件。
dragend当拖动操作结束时（释放⿏标按钮或按下退出键），会触发此事件。
dragenter当拖动的元素或选择⽂本输⼊有效的放置⽬标时，会触发此事件。
dragexit当元素不再是拖动操作的选择⽬标时触发此事件。
dragleave当拖动的元素或⽂本选择离开有效的放置⽬标时，会触发此事件。
dragover当将元素或⽂本选择拖动到有效放置⽬标（每⼏百毫秒）上时，会触发此事件。
dragstart当⽤户开始拖动元素或选择⽂本时触发此事件。
drop当在有效放置⽬标上放置元素或选择⽂本时触发此事件。
2. 案例解析<!DOCTYPE HTML><html><head><style type="text/css">#div1 {width: 450px;height: auto;padding: 30px;border: 1px solid #aaaaaa;}#div1 img {height: 100px;}</style><script type="text/javascript">function allowDrop(ev) {ev.preventDefault();}function drag(ev) {ev.dataTransfer.setData("Text", ev.target.id);}function drop(ev) {ev.preventDefault();var data = ev.dataTransfer.getData("Text");ev.target.appendChild(document.getElementById(data));}</script></head><body><p>请把图⽚拖放到矩形中：</p><div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div><br /><img id="drag1" src="https:///timg?image&quality=80&size=b9999_10000&sec=1591354852841&di=14fb86558db016cc05e2c6b80aea4249&imgtype=0&src=http%3A%2F%%2Fpic%2F78739853 draggable="true" ondragstart="drag(event)" width="100px" /><img id="drag2" src="https:///timg?image&quality=80&size=b9999_10000&sec=1591354852841&di=14fb86558db016cc05e2c6b80aea4249&imgtype=0&src=http%3A%2F%%2Fpic%2F78739853 draggable="true" ondragstart="drag(event)" width="100px" /><img id="dra3" src="https:///timg?image&quality=80&size=b9999_10000&sec=1591354852841&di=14fb86558db016cc05e2c6b80aea4249&imgtype=0&src=http%3A%2F%%2Fpic%2F78739853e draggable="true" ondragstart="drag(event)" width="100px" /><img id="drag4" src="https:///timg?image&quality=80&size=b9999_10000&sec=1591354852841&di=14fb86558db016cc05e2c6b80aea4249&imgtype=0&src=http%3A%2F%%2Fpic%2F78739853 draggable="true" ondragstart="drag(event)" width="100px" /></body></html>拖动后的效果⾸先设置元素为可拖放⾸先，为了使元素可拖动，把 draggable 属性设置为 true ：<img draggable="true" />拖动之后把被拖的对象保存进这个⽅法ondragstart 属性调⽤了⼀个函数，drag(event)，它规定了被拖动的数据。
html中a标签中实现点击事件
html中a标签中实现点击事件我们常⽤的在a标签中有点击事件：1. a href="javascript:js_method();"这是我们平台上常⽤的⽅法，但是这种⽅法在传递this等参数的时候很容易出问题，⽽且javascript:协议作为a的href属性的时候不仅会导致不必要的触发window.onbeforeunload事件，在IE⾥⾯更会使gif动画图⽚停⽌播放。
W3C标准不推荐在href⾥⾯执⾏javascript语句2. a href="javascript:void(0);" onclick="js_method()"这种⽅法是很多⽹站最常⽤的⽅法，也是最周全的⽅法，onclick⽅法负责执⾏js函数，⽽void是⼀个操作符，void(0)返回undefined，地址不发⽣跳转。
⽽且这种⽅法不会像第⼀种⽅法⼀样直接将js⽅法暴露在浏览器的状态栏。
3.a href="javascript:;" onclick="js_method()"这种⽅法跟跟2种类似，区别只是执⾏了⼀条空的js代码。
4.a href="#" onclick="js_method()"这种⽅法也是⽹上很常见的代码，#是标签内置的⼀个⽅法，代表top的作⽤。
所以⽤这种⽅法点击后⽹页后返回到页⾯的最顶端。
5.a href="#" onclick="js_method();return false;"这种⽅法点击执⾏了js函数后return false，页⾯不发⽣跳转，执⾏后还是在页⾯的当前位置。
我看了下taobao的主页，他们采⽤的是第2种⽅法，⽽alibaba的主页是采⽤的第1种⽅法，和我们的区别是每个href⾥的javascript⽅法都⽤try、catch包围。
_HTML5的Video标签的属性、方法和事件汇总
HTML5的Video标签的属性、方法和事件汇总video标签的属性Media = document.getElementById("media");获取video对象src ：视频的属性poster：视频封面，没有播放时显示的图片preload：预加载autoplay：自动播放loop：循环播放controls：浏览器自带的控制条width：视频宽度height：视频高度html 代码video id="media" src="sundxs/test.mp4" controls width="400px" heigt="400px"/video//audio和video都可以通过JS获取对象,JS通过id获取video和audio 的'对象Media方法和属性HTMLVideoElement和HTMLAudioElement 均继承自HTMLMediaElement Media.error; //null:正常Media.error.code; //1.用户终止 2.网络错误 3.解码错误 4.URL无效 //网络状态- Media.currentSrc; //返回当前资源的URL- Media.src = value; //返回或设置当前资源的URL- Media.canPlayType(type); //是否能播放某种格式的资源- workState; //0.此元素未初始化 1.正常但没有使用网络 2.正在下载数据 3.没有找到资源- Media.load(); //重新加载src指定的资源- Media.buffered; //返回已缓冲区域，TimeRanges- Media.preload; //none:不预载 metadata:预载资源信息 auto://准备状态- Media.readyState;//1:HAVE_NOTHING 2:HAVE_METADATA3.HAVE_CURRENT_DATA4.HAVE_FUTURE_DATA5.HAVE_ENOUGH_DATA- Media.seeking; //是否正在seeking//回放状态Media.currentTime = value; //当前播放的位置，赋值可改变位置Media.startTime; //一般为0，如果为流媒体或者不从0开始的资源，则不为0Media.duration; //当前资源长度流返回无限Media.paused; //是否暂停Media.defaultPlaybackRate = value;//默认的回放速度，可以设置Media.playbackRate = value;//当前播放速度，设置后马上改变Media.played; //返回已经播放的区域，TimeRanges，关于此对象见下文 Media.seekable; //返回可以seek的区域 TimeRangesMedia.ended; //是否结束Media.autoPlay; //是否自动播放Media.loop; //是否循环播放Media.play(); //播放Media.pause(); //暂停//视频控制Media.controls;//是否有默认控制条Media.volume = value; //音量Media.muted = value; //静音TimeRanges(区域)对象TimeRanges.length; //区域段数TimeRanges.start(index) //第index段区域的开始位置TimeRanges.end(index) //第index段区域的结束位置//相关事件var eventTester = function(e){Media.addEventListener(e,function(){console.log((new Date()).getTime(),e)},false);}eventTester("loadstart"); //客户端开始请求数据eventTester("progress"); //客户端正在请求数据eventTester("suspend"); //延迟下载eventTester("abort"); //客户端主动终止下载(不是因为错误引起) eventTester("loadstart"); //客户端开始请求数据eventTester("progress"); //客户端正在请求数据eventTester("suspend"); //延迟下载eventTester("abort"); //客户端主动终止下载(不是因为错误引起)， eventTester("error"); //请求数据时遇到错误eventTester("stalled"); //网速失速eventTester("play"); //play()和autoplay开始播放时触发eventTester("pause"); //pause()触发eventTester("loadedmetadata"); //成功获取资源长度eventTester("loadeddata"); //eventTester("waiting"); //等待数据，并非错误eventTester("playing"); //开始回放eventTester("canplay"); //可以播放，但中途可能因为加载而暂停 eventTester("canplaythrough"); //可以播放，歌曲全部加载完毕 eventTester("seeking"); //寻找中eventTester("seeked"); //寻找完毕eventTester("timeupdate"); //播放时间改变eventTester("ended"); //播放结束eventTester("ratechange"); //播放速率改变eventTester("durationchange"); //资源长度改变eventTester("volumechange"); //音量改变。
html 事件
当前页面的内容将要被改变时触发的事件
onError
HTML: 2 | 3 | 3.2 | 4
Browser:IE4|N3| O
捕抓当前页面因为某种原因而出现的错误，如脚本错误与外部数据引用的错误
onLoad
HTML: 2 | 3 | 3.2 |4
Browser:IE3|N2|O3
Browser:IE5| N | O
当某个对象被拖动时触发的事件[活动事件]
onDragDrop
HTML: 2 | 3 | 3.2 | 4
Browser: IE |N4| O
一个外部对象被鼠标拖进当前窗口或者帧
onDragEnd
HTML: 2 | 3 | 3.2 | 4
Browser:IE5| N | O
Browser:IE4|N4| O
鼠标上的按钮被按下了
onMouseUp
HTML: 2 | 3 | 3.2 |4
Browser:IE4|N4| O
鼠标按下后，松开时激发的事件
onMouseOver
HTML: 2 | 3 | 3.2 |4
Browser:IE3|N2|O3
当鼠标移动到某对象范围的上方时触发的事件
onBeforeEditFocus
HTML: 2 | 3 | 3.2 | 4
Browser:IE5| N | O
当前元素将要进入编辑状态
onBeforePaste
HTML: 2 | 3 | 3.2 | 4
Browser:IE5| N | O
内容将要从浏览者的系统剪贴板传送[粘贴]到页面中时触发的事件
onCopy
HTML: 2 | 3 | 3.2 | 4
htmlselect标签点击选中事件
htmlselect标签点击选中事件html select标签点击选中事件原⽂js事件οnchange="gradeChange(this.options[this.options.selectedIndex].text)"获取⽂本的值this.options[this.options.selectedIndex].text 是⽂本的值获取value的值this.options[this.options.selectedIndex].value 是value值<!DOCTYPE html><html><head><meta charset="utf-8"><title>⽥⽒</title></head><body><select id="slt" onchange="gradeChange(this.options[this.options.selectedIndex].text)"><option value="0">蔬菜</option><option value="1">⽔果</option><option value="2">⼟地</option><option value="3">⾷品安全</option><option value="4">认养体验</option><option value="5">城乡合作</option><option value="6">供应信息</option><option value="7">农业快讯</option></select></body><script>function gradeChange(tx){alert(tx);this.options[this.options.selectedIndex].text;}</script></html>。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
onMove -- 浏览器的窗口被移动时触发的事件
onResize -- 当浏览器的窗口大小被改变时触发的事件
onScroll -- 浏览器的滚动条位置发生变化时触发的事件
onStop -- 浏览器的停止按钮被按下时触发的事件或者正在下载的文件被中断
onErrorUpdate -- 当使用onBeforeUpdate事件触发取消了数据传送时，代替onAfterUpdate事件
onRowEnter HTML:当前数据源的数据发生变化并且有新的有效数据时触发的事件
onRowExit HTML:当前数据源的数据将要发生变化时触发的事件
onRowsDelete -- 当前数据记录将被删除时触发的事件
onDragEnter -- 当对象被鼠标拖动的对象进入其容器范围内时触发的事件
onDragLeave -- 当对象被鼠标拖动的对象离开其容器范围内时触发的事件
onDragOver -- 当某被拖动的对象在另一对象容器范围内拖动时触发的事件 [活动事件]
onDragStart -- 当某对象将被拖动时触发的事件
数据绑定:
onAfterUpdate -- 当数据完成由数据源到对象的传送时触发的事件
onCellChange HTML:当数据来源发生变化时
onDataAvailable -- 当数据接收完成时触发事件
onDatasetChanged -- 数据在数据源发生变化时触发的事件
onDatasetComplete -- 当来子数据源的全部有效数据读取完毕时触发的事件
onMouseMove -- 鼠标移动时触发的事件
onMouseOut -- 当鼠标离开某对象范围时触发的事件
onKeyPress -- 当键盘上的某个键被按下并且释放时触发的事件.[注意:页面内必须有被聚焦的对象]
onKeyDown -- 当键盘上某个按键被按下时触发的事件[注意:页面内必须有被聚焦的对象]
onBeforeEditFocus -- 当前元素将要进入编辑状态
onBeforePaste -- 内容将要从浏览者的系统剪贴板传送[粘贴]到页面中时触发的事件
onBeforeUpdate -- 当浏览者粘贴系统剪贴板中的内容时通知目标对象
onContextMenu -- 当浏览者按下鼠标右键出现菜单时或者通过键盘的按键触发页面菜单时触发的事件 [试试在页面中的中加入onContentMenu="return false"就可禁止使用鼠标右键了]
onDrop -- 在一个拖动过程中，释放鼠标键时触发的事件
onLoseCapture -- 当元素失去鼠标移动所形成的选择焦点时触发的事件
onPaste -- 当内容被粘贴时触发的事件
onSelect -- 当文本内容被选择时的事件
onSelectStart HTML当文本内容选择将开始发生时触发的事件
onUnload -- 当前页面将被改变时触发的事件
表单相关事件:
onBlur -- 当前元素失去焦点时触发的事件 [鼠标与键盘的触发均可]
onChange -- 当前元素失去焦点并且元素的内容发生改变而触发的事件 [鼠标与键盘的触发均可]
onFocus -- 当某个元素获得焦点时触发的事件
onCopy -- 当页面当前的被选择内容被复制后触发的事件
onCut -- 当页面当前的被选择内容被剪切时触发的事件
onDrag -- 当某个对象被拖动时触发的事件 [活动事件]
onDragDrop -- 一个外部对象被鼠标拖进当前窗口或者帧
onDragEnd HTML:当鼠标拖动结束时触发的事件，即鼠标的按钮被释放了
onRowsInserted -- 当前数据源将要插入新数据记录时触发的事件
外部事件:
rint -- 当文档被打印后触发的事件
onBeforePrint -- 当文档即将打印时触发的事件
onFilterChange -- 当某个对象的滤镜效果发生变化时触发的事件
onHelp -- 当浏览者按下F1或者浏览器的帮助选择时触发的事件
onReset -- 当表单中RESET的属性被激发时触发的事件
onSubmit -- 一个表单被递交时触发的事件
滚动字幕事件:
onBounce -- 在Marquee内的内容移动至Marquee显示范围之外时触发的事件
onFinish -- 当Marquee元素完成需要显示的内容后触发的事件
onStart -- 当Marquee元素开始显示内容时触发的事件
编辑事件:
onBeforeCopy HTML:当页面当前的被选择内容将要复制到浏览者系统的剪贴板前触发的事件
onBeforeCut -- 当页面中的一部分或者全部的内容将被移离当前页面[剪贴]并移动到浏览者的系统剪贴板时触发的事件
一般事件:
onClick -- 鼠标点击事件，多用在某个对象控制的范围内的鼠标点击
onDblClick -- 鼠标双击事件
onMouseDown -- 鼠标上的按钮被按下了
onMouseUp -- 鼠标按下后，松开时激发的事件
onMouseOver -- 当鼠标移动到某对象范围的上方时触发的事件
onKeyUp -- 当键盘上某个按键被按放开时触发的事件[注意:页面内必须有被聚焦的对象]
页面相关事件:
onAbort -- 图片在下载时被用户中断
onBeforeUnload -- 当前页面的内容将要被改变时触发的事件
onError -- 捕抓当前页面因为某种原因而出现的错误，如脚本错误与外部数据引用的错误
onPropertyChange -- 当对象的属性之一发生变化时触发的事件
onReadyStateChange -- 当对象的初始化属性值发生变化时触发的事件