首页 >web前端 >html教程 >HTML 事件

HTML 事件

WBOY
WBOY原创
2024-09-04 16:14:20957浏览

在使用 HTML 脚本(超文本标记语言)创建的网页或网站中,用户和 Web 工具本身执行的每个操作都称为 HTML 事件。每个事件的描述包含六种类型的属性:窗口事件属性、表单事件属性、键盘事件属性、鼠标事件属性、媒体事件属性和剪贴板事件属性。每个事件属性都将具有特定的专用属性,用于获取 HTML 事件的详细信息。

不同类型的 HTML 事件

HTML5 中有许多可用的事件属性,主要分为 6 种不同类型。这些属性使用 JavaScript 语言工作。

HTML 事件

  •  Windows 事件属性: 这是为 windows 对象的操作提供的。它适用于 body 标签。
  •  表单事件属性: 如果用户在表单中执行某些操作(例如输入数据、取消、提交),则这些事件属性将起作用。
  •  键盘事件属性: 此键盘事件属性用于键盘操作和用户交互。
  •  鼠标事件属性: 用于移动、单击、滚轮等鼠标操作的鼠标事件属性。
  •  剪贴板事件属性: 此事件属性用于剪贴板操作:例如、剪切、复制、害虫。
  •  媒体事件属性: 此事件属性适用于视频等媒体文件。

事件属性说明

这里是一些事件属性的解释,下面详细给出:

1. Windows 事件属性

Attribute

Description

onafterprint This script act, though, after the document printed.
onbeforeprint This script act, though, before a document printed.
onbeforeunload Whereas before the unloaded document, this Script works.
onerror  In the document occurs the Error then this event executed.
onhashchange  The anchor part of URL change in the document that time event executed.
onload When the first Web page is loaded completely, then this event executed.
onmessage In the document, the message that occurred at that time event executed.
onoffline If the network connection is unavailable and the browser says offline, then the event executed.
ononline When the network available in the browser, then the event executed.
onpagehide This script act; if the user not working on a current webpage, a then-current page can be hidden.
onpageshow This script act at that time the current webpage is load.
onpopstate This script automatically works on the browser for a history state change.
onresize This script act when the browser of the window changes the size.
onstorage When users web storage updated, then the event executed.
onunload The user’s current web page is not loaded or the window is closed, then the event is executed.
属性

描述

onafterprint 不过,该脚本在文档打印后起作用。 onbeforeprint 不过,该脚本在打印文档之前起作用。 卸载前 在卸载文档之前,此脚本有效。 错误  文档中发生错误,然后执行此事件。 onhashchange  事件执行时文档中 URL 的锚点部分发生变化。 加载 当第一个网页加载完成时,执行此事件。 onmessage 在文档中,执行当时发生的事件的消息。 在线离线 如果网络连接不可用并且浏览器显示离线,则执行该事件。 在线 当浏览器中网络可用时,则执行该事件。 页面隐藏 这个脚本行为;如果用户不在当前网页上工作,则可以隐藏当前页面。 onpageshow 此脚本在当前网页加载时起作用。 onpopstate 此脚本会自动在浏览器上运行以更改历史状态。 调整大小 该脚本在窗口的浏览器改变大小时起作用。 存储 当用户网络存储更新时,则执行该事件。 卸载 用户当前网页未加载或窗口关闭,则执行该事件。 表>

2.表单事件属性

Attribute Description
onblur Some form validation object loos the focus, then event fired.
onchange The value change in the form, then event fired.
onfocus In the form , ,
oninput The user gives input of value in the form then this event fired.
oninvalid The event works on when the element does not satisfy its predefined constraints.
onreset User reset the form information, then event fired.
onsearch Users search the required field, then event fired.
onselect The user selects the text or text area in form, then event fired.
onsubmit The user submits the form at the end then the event fired.

3.键盘事件属性

Attribute    Description
onkeydown Using a keyboard, the user press the key down at that point event works
onkeypress Using the keyboard, users press the key and display characters at that point event works.
onkeyup After the press, the key user releases the key then the event works.

4.鼠标事件属性

   Attribute Description
onclick The user clicks the mouse on the button then an event occurred.
ondblclick Users double click the mouse then the event occurred.
onmousedown The user presses the mouse button on the element then the event occurred.
onmousemove The user moves the mouse pointer over the element then the event occurred.
onmouseout The user moves the mouse outside of the element then the event occurred.
onmouseover  The user moves the mouse over the element then the event occurred.
onmouseup The user released the mouse button then the event occurred.
onmousewheel Using the mouse wheel user rolls the up and down on element then the event occurred.
onwheel Using a mouse wheel user roll them up and down then the event occurred.

5.剪贴板事件属性

 Attribute Description
oncopy Using mouse users to copy the content, then the event occurred.
oncut Using a mouse, users cut the content then the event occurred.
onpaste Using a mouse user, paste the content, then an event occurred.

6.媒体事件属性

Attribute Description
onabort When media files aborted for download and play again, then an event occurs.
oncanplay When any media file ready for play, then this trigger is fired.
oncanplaythrough Media file ready to play without buffering and loading.
oncuechange Element changes the cue of then event fired.
ondurationchange The Media file changes the length of time then the trigger is fired.
onemptied If the Media file unavailable and come fatal error, then the trigger is fired.
onended The Media file comes on endpoint then the trigger is fired.
onerror When an error occurred to get the media file, the trigger is fired
onloadeddata The Media file loads the data then the trigger is fired.
onloadedmetadata The Media file loads the metadata then the trigger is fired.
onloadstart The Media file starts to load then the trigger is fired.
onpause The Media file paused to play again then the trigger is fired.
onplay Media file ready to play, then trigger is fired.
onplaying The Media file starts to play when the trigger is fired.
onprogress This script act when the browser is working on connecting with the media data.
onratechange If the videos playback speed is changed, then the trigger is fired.
onseeked Users completed moving; otherwise, skip the new position of video. this attribute set as false.
onseeking The user wants to move; otherwise, skip the new position of the video. this attribute set as true.
onstalled When the browser suddenly stops to the connection of data, then the event works.
onsuspend When the web Browser on purpose does not get media data, then events work.
ontimeupdate When a user changes the video play position like forward and backward.
onvolumechange To change media volume low to high.
onwaiting If the data load the information, current video stop with buffering then event works.

结论

Html 事件是在 Web 浏览器和用户之间采取操作和交互的一种简单方法。用户可以毫不费力地获得每个动作的反应。例如,剪贴板的剪切和复制、鼠标的移动和单击、表单的按钮。事件使网络应用程序变得实时并打造智能工作系统。

以上是HTML 事件的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
上一篇:HTML Commands下一篇:HTML Fonts Styles