suchen

HTML-Ereignisse

Sep 04, 2024 pm 04:14 PM
htmlhtml5HTML TutorialHTML PropertiesHTML tags

Auf einer Webseite oder Website, die mit dem HTML-Skript (HyperText Markup Language) erstellt wurde, wird jede vom Benutzer und dem Web-Tool selbst ausgeführte Aktion als HTML-Ereignis bezeichnet. Die Beschreibung enthält sechs Arten von Attributen für jedes Ereignis: Fensterereignisattribut, Formularereignisattribut, Tastaturereignisattribut, Mausereignisattribut, Medienereignisattribut und Zwischenablageereignisattribut. Jedes dieser Ereignisattribute verfügt über spezifische dedizierte Attribute, die zum Abrufen der Details des HTML-Ereignisses verwendet werden.

Verschiedene Arten von HTML-Ereignissen

In HTML5 sind viele Ereignisattribute verfügbar, die hauptsächlich in 6 verschiedene Typen klassifiziert werden. Diese Attribute funktionieren mit der JavaScript-Sprache.

HTML-Ereignisse

  •  Windows-Ereignisattribute: Dies wird für die Aktion des Windows-Objekts bereitgestellt. Es funktioniert im Body-Tag  .
  •  Formularereignisattribute: Wenn der Benutzer eine Aktion im Formular ausführt, z. B. Daten eingeben, abbrechen, senden, funktionieren diese Ereignisattribute.
  •  Tastaturereignisattribute: Diese Tastaturereignisattribute werden für Tastaturaktionen und Benutzerinteraktionen verwendet.
  •  Mausereignisattribute: Mausereignisattribut, das für Mausaktionen wie Bewegen, Klicken, Drehen usw. verwendet wird.
  •  Ereignisattribute der Zwischenablage: Diese Ereignisattribute werden für die Aktion der Zwischenablage verwendet: Beispiel, Ausschneiden, Kopieren, Schädling.
  •  Medienereignisattribute: Dieses Ereignisattribut funktioniert bei Mediendateien wie Videos usw.

Beschreibung der Ereignisattribute

Hier finden Sie eine Erläuterung der unten aufgeführten Ereignisattribute im Detail:

1. Windows-Ereignisattribute

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.
Attribut

Beschreibung

onafterprint Dieses Skript wird jedoch ausgeführt, nachdem das Dokument gedruckt wurde. onbeforeprint Dieses Skript wird jedoch ausgeführt, bevor ein Dokument gedruckt wird. onbeforeunload Während vor dem entladenen Dokument dieses Skript funktioniert. onerror  Im Dokument tritt der Fehler auf, dann wird dieses Ereignis ausgeführt. onhashchange  Der Ankerteil der URL-Änderung im Dokument, als das Ereignis ausgeführt wurde. onload Wenn die erste Webseite vollständig geladen ist, wird dieses Ereignis ausgeführt. onmessage Im Dokument wird die Nachricht ausgeführt, die zu diesem Zeitpunkt aufgetreten ist. onoffline Wenn die Netzwerkverbindung nicht verfügbar ist und der Browser „Offline“ anzeigt, wird das Ereignis ausgeführt. online Wenn das Netzwerk im Browser verfügbar ist, wird das Ereignis ausgeführt. onpagehide Dieser Skriptakt; Wenn der Benutzer nicht an einer aktuellen Webseite arbeitet, kann eine dann aktuelle Seite ausgeblendet werden. onpageshow Dieses Skript fungiert zu dem Zeitpunkt, zu dem die aktuelle Webseite geladen wird. onpopstate Dieses Skript funktioniert automatisch im Browser bei einer Änderung des Verlaufsstatus. onresize Dieses Skript wird ausgeführt, wenn der Browser des Fensters die Größe ändert. im Speicher Wenn der Webspeicher des Benutzers aktualisiert wurde, wird das Ereignis ausgeführt. onunload Wenn die aktuelle Webseite des Benutzers nicht geladen wird oder das Fenster geschlossen ist, wird das Ereignis ausgeführt.

2. Formularereignisattribute

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. Tastaturereignisattribute

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. Mausereignisattribute

   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. Ereignisattribute der Zwischenablage

 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. Medienereignisattribute

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.

Fazit

Html-Ereignisse sind eine einfache Möglichkeit, Maßnahmen zu ergreifen und eine Schnittstelle zwischen Webbrowsern und Benutzern herzustellen. Benutzer können mühelos die Reaktion auf jede Aktion verfolgen. Beispielsweise Ausschneiden und Kopieren für die Zwischenablage, Verschieben und Klicken für die Maus, Schaltflächen für das Formular. Ereignisse machen Webanwendungen in Echtzeit und schaffen intelligente Arbeitssysteme.

Das obige ist der detaillierte Inhalt vonHTML-Ereignisse. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Warum sind HTML -Tags für die Webentwicklung wichtig?Warum sind HTML -Tags für die Webentwicklung wichtig?May 02, 2025 am 12:03 AM

HtmltagsareessentialwebdevelopmentaTheStructureAndenhanceWebpages.1) Sie definelayout, semantics und interaktivität.2) SemantictagsimproveAccessibilityandseo.3) ordnungsgemäße Kennzeichnung.

Erläutern Sie die Bedeutung der Verwendung eines konsistenten Codierungsstils für HTML -Tags und -attribute.Erläutern Sie die Bedeutung der Verwendung eines konsistenten Codierungsstils für HTML -Tags und -attribute.May 01, 2025 am 12:01 AM

Ein konsistenter HTML -Codierungsstil ist wichtig, da er die Lesbarkeit, Wartbarkeit und Effizienz des Codes verbessert. 1) Verwenden Sie Kleinbuchstaben und Attribute, 2) Behalten Sie die konsistente Einklebung, 3) Wählen und halten Sie sich an Einzel- oder Doppelzitate.

Wie implementieren Sie Multi-Project-Karussell in Bootstrap 4?Wie implementieren Sie Multi-Project-Karussell in Bootstrap 4?Apr 30, 2025 pm 03:24 PM

Lösung zur Implementierung von Multi-Project-Karussell in Bootstrap4, das Multi-Project-Karussell in Bootstrap4 implementiert, ist keine leichte Aufgabe. Obwohl Bootstrap ...

Wie erreicht die offizielle Website von Deepseek den Effekt des durchdringenden Maus -Scroll -Events?Wie erreicht die offizielle Website von Deepseek den Effekt des durchdringenden Maus -Scroll -Events?Apr 30, 2025 pm 03:21 PM

Wie kann man den Effekt der Penetration des Maus -Scroll -Ereignisses erreichen? Wenn wir im Internet stöbern, begegnen wir oft auf spezielle Interaktionsdesigns. Zum Beispiel auf der offiziellen Website von Deepseek � ...

So ändern Sie den Wiedergabesteuerungsstil von HTML -VideoSo ändern Sie den Wiedergabesteuerungsstil von HTML -VideoApr 30, 2025 pm 03:18 PM

Der Standard -Playback -Steuerungsstil von HTML -Video kann nicht direkt über CSS geändert werden. 1. Erstellen Sie benutzerdefinierte Steuerelemente mit JavaScript. 2. verschönern diese Kontrollen durch CSS. 3. Berücksichtigen Sie Kompatibilität, Benutzererfahrung und -leistung. Wenn Sie Bibliotheken wie Video.js oder PLYR verwenden, können Sie den Prozess vereinfachen.

Welche Probleme werden durch die Verwendung von nativem Select auf Ihrem Telefon verursacht?Welche Probleme werden durch die Verwendung von nativem Select auf Ihrem Telefon verursacht?Apr 30, 2025 pm 03:15 PM

Potenzielle Probleme bei der Verwendung natives Auswahl von Mobiltelefonen bei der Entwicklung mobiler Anwendungen haben wir häufig auf die Auswahl von Kästchen. Normalerweise Entwickler ...

Was sind die Nachteile der Verwendung von nativen Auswahl auf Ihrem Telefon?Was sind die Nachteile der Verwendung von nativen Auswahl auf Ihrem Telefon?Apr 30, 2025 pm 03:12 PM

Was sind die Nachteile der Verwendung von nativen Auswahl auf Ihrem Telefon? Bei der Entwicklung von Anwendungen auf mobilen Geräten ist es sehr wichtig, die richtigen UI -Komponenten auszuwählen. Viele Entwickler ...

Wie optimieren Sie die Kollisionsabwicklung von Dritten in einem Raum mit drei.Js und Octree?Wie optimieren Sie die Kollisionsabwicklung von Dritten in einem Raum mit drei.Js und Octree?Apr 30, 2025 pm 03:09 PM

Verwenden Sie drei.Js und Octree, um die Kollisionsabwicklung von Drittrohr im Raum zu optimieren. Verwenden Sie Octree in drei.js, um das Roaming von Drittpersonen im Raum zu implementieren, und fügen Sie Kollisionen hinzu ...

See all articles

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heiße Werkzeuge

SecLists

SecLists

SecLists ist der ultimative Begleiter für Sicherheitstester. Dabei handelt es sich um eine Sammlung verschiedener Arten von Listen, die häufig bei Sicherheitsbewertungen verwendet werden, an einem Ort. SecLists trägt dazu bei, Sicherheitstests effizienter und produktiver zu gestalten, indem es bequem alle Listen bereitstellt, die ein Sicherheitstester benötigen könnte. Zu den Listentypen gehören Benutzernamen, Passwörter, URLs, Fuzzing-Payloads, Muster für vertrauliche Daten, Web-Shells und mehr. Der Tester kann dieses Repository einfach auf einen neuen Testcomputer übertragen und hat dann Zugriff auf alle Arten von Listen, die er benötigt.

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

DVWA

DVWA

Damn Vulnerable Web App (DVWA) ist eine PHP/MySQL-Webanwendung, die sehr anfällig ist. Seine Hauptziele bestehen darin, Sicherheitsexperten dabei zu helfen, ihre Fähigkeiten und Tools in einem rechtlichen Umfeld zu testen, Webentwicklern dabei zu helfen, den Prozess der Sicherung von Webanwendungen besser zu verstehen, und Lehrern/Schülern dabei zu helfen, in einer Unterrichtsumgebung Webanwendungen zu lehren/lernen Sicherheit. Das Ziel von DVWA besteht darin, einige der häufigsten Web-Schwachstellen über eine einfache und unkomplizierte Benutzeroberfläche mit unterschiedlichen Schwierigkeitsgraden zu üben. Bitte beachten Sie, dass diese Software

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

MinGW – Minimalistisches GNU für Windows

MinGW – Minimalistisches GNU für Windows

Dieses Projekt wird derzeit auf osdn.net/projects/mingw migriert. Sie können uns dort weiterhin folgen. MinGW: Eine native Windows-Portierung der GNU Compiler Collection (GCC), frei verteilbare Importbibliotheken und Header-Dateien zum Erstellen nativer Windows-Anwendungen, einschließlich Erweiterungen der MSVC-Laufzeit zur Unterstützung der C99-Funktionalität. Die gesamte MinGW-Software kann auf 64-Bit-Windows-Plattformen ausgeführt werden.