События в javascript список: Справочник по событиям | MDN

Содержание

Справочник по событиям | MDN

`abort`	`UIEvent`	DOM L3	The loading of a resource has been aborted.
`abort`	`ProgressEvent`	Progress and XMLHttpRequest	Progression has been terminated (not due to an error).
`abort`	`Event`	IndexedDB	A transaction has been aborted.
`afterprint`	`Event`	HTML5	The associated document has started printing or the print preview has been closed.
`animationcancel`	`AnimationEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	CSS Animations	A CSS animation has aborted.
`animationend`	`AnimationEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	CSS Animations	A CSS animation has completed.
`animationiteration`	`AnimationEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	CSS Animations	A CSS animation is repeated.
`animationstart`	`AnimationEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	CSS Animations	A CSS animation has started.
`appinstalled`	`Event`	Web App Manifest	A web application is successfully installed as a progressive web app.
`audioprocess`	`AudioProcessingEvent` Это устаревшее API больше не должно использоваться, но оно по-прежнему может работать.	Web Audio API Определение ‘audioprocess’ в этой спецификации.	The input buffer of a `ScriptProcessorNode` is ready to be processed.
`audioend` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`Event`	Web Speech API	The user agent has finished capturing audio for speech recognition.
`audiostart` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`Event`	Web Speech API	The user agent has started to capture audio for speech recognition.
`beforeprint`	`Event`	HTML5	The associated document is about to be printed or previewed for printing.
`beforeunload`	`BeforeUnloadEvent`	HTML5	The window, the document and its resources are about to be unloaded.
`beginEvent`	`TimeEvent`	SVG	A SMIL animation element begins.
`blocked`		IndexedDB	An open connection to a database is blocking a `versionchange` transaction on the same database.
`blur`	`FocusEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	DOM L3	An element has lost focus (does not bubble).
`boundary` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`SpeechSynthesisEvent`	Web Speech API	The spoken utterance reaches a word or sentence boundary
`canplay`	`Event`	HTML5 media	The user agent can play the media, but estimates that not enough data has been loaded to play the media up to its end without having to stop for further buffering of content.
`canplaythrough`	`Event`	HTML5 media	The user agent can play the media up to its end without having to stop for further buffering of content.
`change`	`Event`	DOM L2, HTML5	The `change` event is fired for `<input>`, `<select>`, and `<textarea>` elements when a change to the element’s value is committed by the user.
`chargingchange`	`Event`	Battery status	The battery begins or stops charging.
`chargingtimechange`	`Event`	Battery status	The `chargingTime` attribute has been updated.
`click`	`MouseEvent`	DOM L3	A pointing device button has been pressed and released on an element.
`close`	`Event`	WebSocket	A WebSocket connection has been closed.
`complete`		IndexedDB	A transaction successfully completed.
`complete`	`OfflineAudioCompletionEvent` Это устаревшее API больше не должно использоваться, но оно по-прежнему может работать.	Web Audio API Определение ‘OfflineAudioCompletionEvent’ в этой спецификации.	The rendering of an `OfflineAudioContext` is terminated.
`compositionend`	`CompositionEvent`	DOM L3	The composition of a passage of text has been completed or canceled.
`compositionstart`	`CompositionEvent`	DOM L3	The composition of a passage of text is prepared (similar to keydown for a keyboard input, but works with other inputs such as speech recognition).
`compositionupdate`	`CompositionEvent`	DOM L3	A character is added to a passage of text being composed.
`contextmenu`	`MouseEvent`	HTML5	The right button of the mouse is clicked (before the context menu is displayed).
`copy`	`ClipboardEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	Clipboard	The text selection has been added to the clipboard.
`cut`	`ClipboardEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	Clipboard	The text selection has been removed from the document and added to the clipboard.
`dblclick`	`MouseEvent`	DOM L3	A pointing device button is clicked twice on an element.
`devicechange`	`Event`	Media Capture and Streams	A media device such as a camera, microphone, or speaker is connected or removed from the system.
`devicemotion`	`DeviceMotionEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	Device Orientation Events	Fresh data is available from a motion sensor.
`deviceorientation`	`DeviceOrientationEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	Device Orientation Events	Fresh data is available from an orientation sensor.
`dischargingtimechange`	`Event`	Battery status	The `dischargingTime` attribute has been updated.
`DOMActivate` Это устаревшее API больше не должно использоваться, но оно по-прежнему может работать.	`UIEvent`	DOM L3	A button, link or state changing element is activated (use `click` instead).
`DOMAttributeNameChanged` Это устаревшее API больше не должно использоваться, но оно по-прежнему может работать.	`MutationNameEvent`	DOM L3 Removed	The name of an attribute changed (use mutation observers instead).
`DOMAttrModified` Это устаревшее API больше не должно использоваться, но оно по-прежнему может работать.	`MutationEvent`	DOM L3	The value of an attribute has been modified (use mutation observers instead).
`DOMCharacterDataModified` Это устаревшее API больше не должно использоваться, но оно по-прежнему может работать.	`MutationEvent`	DOM L3	A text or another CharacterData has changed (use mutation observers instead).
`DOMContentLoaded`	`Event`	HTML5	The document has finished loading (but not its dependent resources).
`DOMElementNameChanged` Это устаревшее API больше не должно использоваться, но оно по-прежнему может работать.	`MutationNameEvent`	DOM L3 Removed	The name of an element changed (use mutation observers instead).
`DOMFocusIn` Это устаревшее API больше не должно использоваться, но оно по-прежнему может работать.	`FocusEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	DOM L3	An element has received focus (use `focus` or `focusin` instead).
`DOMFocusOut` Это устаревшее API больше не должно использоваться, но оно по-прежнему может работать.	`FocusEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	DOM L3	An element has lost focus (use `blur` or `focusout` instead).
`DOMNodeInserted` Это устаревшее API больше не должно использоваться, но оно по-прежнему может работать.	`MutationEvent`	DOM L3	A node has been added as a child of another node (use mutation observers instead).
`DOMNodeInsertedIntoDocument` Это устаревшее API больше не должно использоваться, но оно по-прежнему может работать.	`MutationEvent`	DOM L3	A node has been inserted into the document (use mutation observers instead).
`DOMNodeRemoved` Это устаревшее API больше не должно использоваться, но оно по-прежнему может работать.	`MutationEvent`	DOM L3	A node has been removed from its parent node (use mutation observers instead).
`DOMNodeRemovedFromDocument` Это устаревшее API больше не должно использоваться, но оно по-прежнему может работать.	`MutationEvent`	DOM L3	A node has been removed from the document (use mutation observers instead).
`DOMSubtreeModified` Это устаревшее API больше не должно использоваться, но оно по-прежнему может работать.	`MutationEvent`	DOM L3	A change happened in the document (use mutation observers instead).
`drag`	`DragEvent`	HTML5	An element or text selection is being dragged (every 350ms).
`dragend`	`DragEvent`	HTML5	A drag operation is being ended (by releasing a mouse button or hitting the escape key).
`dragenter`	`DragEvent`	HTML5	A dragged element or text selection enters a valid drop target.
`dragleave`	`DragEvent`	HTML5	A dragged element or text selection leaves a valid drop target.
`dragover`	`DragEvent`	HTML5	An element or text selection is being dragged over a valid drop target (every 350ms).
`dragstart`	`DragEvent`	HTML5	The user starts dragging an element or text selection.
`drop`	`DragEvent`	HTML5	An element is dropped on a valid drop target.
`durationchange`	`Event`	HTML5 media	The `duration` attribute has been updated.
`emptied`	`Event`	HTML5 media	The media has become empty; for example, this event is sent if the media has already been loaded (or partially loaded), and the `load()` method is called to reload it.
`end` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`Event`	Web Speech API	The speech recognition service has disconnected.
`end` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`SpeechSynthesisEvent`	Web Speech API	The utterance has finished being spoken.
`ended`	`Event`	HTML5 media	Playback has stopped because the end of the media was reached.
`ended`	`Event`	Web Audio API	Playback has stopped because the end of the media was reached.
`endEvent`	`TimeEvent`	SVG	A SMIL animation element ends.
`error`	`UIEvent`	DOM L3	A resource failed to load.
`error`	`ProgressEvent`	Progress and XMLHttpRequest	Progression has failed.
`error`	`Event`	WebSocket	A WebSocket connection has been closed with prejudice (some data couldn’t be sent for example).
`error`	`Event`	Server Sent Events	An event source connection has been failed.
`error`	`Event`	IndexedDB	A request caused an error and failed.
`error` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`Event`	Web Speech API	A speech recognition error occurs.
`error`	`SpeechSynthesisErrorEvent`	Web Speech API	An error occurs that prevents the utterance from being successfully spoken.
`focus`	`FocusEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	DOM L3	An element has received focus (does not bubble).
`focusin`	`FocusEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	DOM L3	An element is about to receive focus (bubbles).
`focusout`	`FocusEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	DOM L3	An element is about to lose focus (bubbles).
`fullscreenchange`	`Event`	Full Screen	An element was turned to fullscreen mode or back to normal mode.
`fullscreenerror`	`Event`	Full Screen	It was impossible to switch to fullscreen mode for technical reasons or because the permission was denied.
`gamepadconnected`	`GamepadEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	Gamepad	A gamepad has been connected.
`gamepaddisconnected`	`GamepadEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	Gamepad	A gamepad has been disconnected.
`gotpointercapture`	`PointerEvent`	Pointer Events	Element receives pointer capture.
`hashchange`	`HashChangeEvent`	HTML5	The fragment identifier of the URL has changed (the part of the URL after the #).
`lostpointercapture`	`PointerEvent`	Pointer Events	Element lost pointer capture.
`input`	`Event`	HTML5	The value of an element changes or the content of an element with the attribute contenteditable is modified.
`invalid`	`Event`	HTML5	A submittable element has been checked and doesn’t satisfy its constraints.
`keydown`	`KeyboardEvent`	DOM L3	A key is pressed down.
`keypress` Это устаревшее API больше не должно использоваться, но оно по-прежнему может работать.	`KeyboardEvent`	DOM L3	A key is pressed down and that key normally produces a character value (use input instead).
`keyup`	`KeyboardEvent`	DOM L3	A key is released.
`languagechange` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`Event`	HTML 5.1 Определение ‘NavigatorLanguage.languages’ в этой спецификации.	The user’s preferred languages have changed.
`levelchange`	`Event`	Battery status	The `level` attribute has been updated.
`load`	`UIEvent`	DOM L3	A resource and its dependent resources have finished loading.
`load`	`ProgressEvent`	Progress and XMLHttpRequest	Progression has been successful.
`loadeddata`	`Event`	HTML5 media	The first frame of the media has finished loading.
`loadedmetadata`	`Event`	HTML5 media	The metadata has been loaded.
`loadend`	`ProgressEvent`	Progress and XMLHttpRequest	Progress has stopped (after «error», «abort» or «load» have been dispatched).
`loadstart`	`ProgressEvent`	Progress and XMLHttpRequest	Progress has begun.
`mark` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`SpeechSynthesisEvent`	Web Speech API	The spoken utterance reaches a named SSML «mark» tag.
`message`	`MessageEvent`	WebSocket	A message is received through a WebSocket.
`message`	`MessageEvent`	Web Workers	A message is received from a Web Worker.
`message`	`MessageEvent`	Web Messaging	A message is received from a child (i)frame or a parent window.
`message`	`MessageEvent`	Server Sent Events	A message is received through an event source.
`messageerror`	`MessageEvent`	`MessagePort`, Web Workers, Broadcast Channel, `Window`	A message error is raised when a message is received by an object.
`message` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`ServiceWorkerMessageEvent` or `ExtendableMessageEvent`, depending on context.	Service Workers	A message is received from a service worker, or a message is received in a service worker from another context.
`mousedown`	`MouseEvent`	DOM L3	A pointing device button (usually a mouse) is pressed on an element.
`mouseenter`	`MouseEvent`	DOM L3	A pointing device is moved onto the element that has the listener attached.
`mouseleave`	`MouseEvent`	DOM L3	A pointing device is moved off the element that has the listener attached.
`mousemove`	`MouseEvent`	DOM L3	A pointing device is moved over an element.
`mouseout`	`MouseEvent`	DOM L3	A pointing device is moved off the element that has the listener attached or off one of its children.
`mouseover`	`MouseEvent`	DOM L3	A pointing device is moved onto the element that has the listener attached or onto one of its children.
`mouseup`	`MouseEvent`	DOM L3	A pointing device button is released over an element.
`nomatch` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`SpeechRecognitionEvent`	Web Speech API	The speech recognition service returns a final result with no significant recognition.
`notificationclick`	`NotificationEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	Notifications API Определение ‘onnotificationclick’ в этой спецификации.	A system notification spawned by `ServiceWorkerRegistration.showNotification()` has been clicked.
`offline`	`Event`	HTML5 offline	The browser has lost access to the network.
`online`	`Event`	HTML5 offline	The browser has gained access to the network (but particular websites might be unreachable).
`open`	`Event`	WebSocket	A WebSocket connection has been established.
`open`	`Event`	Server Sent Events	An event source connection has been established.
`orientationchange`	`Event`	Screen Orientation	The orientation of the device (portrait/landscape) has changed
`pagehide`	`PageTransitionEvent`	HTML5	A session history entry is being traversed from.
`pageshow`	`PageTransitionEvent`	HTML5	A session history entry is being traversed to.
`paste`	`ClipboardEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	Clipboard	Data has been transferred from the system clipboard to the document.
`pause`	`Event`	HTML5 media	Playback has been paused.
`pause` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`SpeechSynthesisEvent`	Web Speech API	The utterance is paused part way through.
`pointercancel`	`PointerEvent`	Pointer Events	The pointer is unlikely to produce any more events.
`pointerdown`	`PointerEvent`	Pointer Events	The pointer enters the active buttons state.
`pointerenter`	`PointerEvent`	Pointer Events	Pointing device is moved inside the hit-testing boundary.
`pointerleave`	`PointerEvent`	Pointer Events	Pointing device is moved out of the hit-testing boundary.
`pointerlockchange`	`Event`	Pointer Lock	The pointer was locked or released.
`pointerlockerror`	`Event`	Pointer Lock	It was impossible to lock the pointer for technical reasons or because the permission was denied.
`pointermove`	`PointerEvent`	Pointer Events	The pointer changed coordinates.
`pointerout`	`PointerEvent`	Pointer Events	The pointing device moved out of hit-testing boundary or leaves detectable hover range.
`pointerover`	`PointerEvent`	Pointer Events	The pointing device is moved into the hit-testing boundary.
`pointerup`	`PointerEvent`	Pointer Events	The pointer leaves the active buttons state.
`play`	`Event`	HTML5 media	Playback has begun.
`playing`	`Event`	HTML5 media	Playback is ready to start after having been paused or delayed due to lack of data.
`popstate`	`PopStateEvent`	HTML5	A session history entry is being navigated to (in certain cases).
`progress`	`ProgressEvent`	Progress and XMLHttpRequest	In progress.
`push`	`PushEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	Push API	A Service Worker has received a push message.
`pushsubscriptionchange`	`PushEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	Push API	A PushSubscription has expired.
`ratechange`	`Event`	HTML5 media	The playback rate has changed.
`readystatechange`	`Event`	HTML5 and XMLHttpRequest	The readyState attribute of a document has changed.
`repeatEvent`	`TimeEvent`	SVG	A SMIL animation element is repeated.
`reset`	`Event`	DOM L2, HTML5	A form is reset.
`resize`	`UIEvent`	DOM L3	The document view has been resized.
`resourcetimingbufferfull`	`Performance`	Resource Timing	The browser’s resource timing buffer is full.
`result` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`SpeechRecognitionEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	Web Speech API	The speech recognition service returns a result — a word or phrase has been positively recognized and this has been communicated back to the app.
`resume` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`SpeechSynthesisEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	Web Speech API	A paused utterance is resumed.
`scroll`	`UIEvent`	DOM L3	The document view or an element has been scrolled.
`seeked`	`Event`	HTML5 media	A seek operation completed.
`seeking`	`Event`	HTML5 media	A seek operation began.
`select`	`UIEvent`	DOM L3	Some text is being selected.
`selectstart` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`Event`	Selection API	A selection just started.
`selectionchange` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`Event`	Selection API	The selection in the document has been changed.
`show`	`MouseEvent`	HTML5	A contextmenu event was fired on/bubbled to an element that has a contextmenu attribute
`slotchange`	`Event`	DOM	The node contents of a `HTMLSlotElement` (`<slot>`) have changed.
`soundend` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`Event`	Web Speech API	Any sound — recognisable speech or not — has stopped being detected.
`soundstart` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`Event`	Web Speech API	Any sound — recognisable speech or not — has been detected.
`speechend` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`Event`	Web Speech API	Speech recognised by the speech recognition service has stopped being detected.
`speechstart` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`Event`	Web Speech API	Sound that is recognised by the speech recognition service as speech has been detected.
`stalled`	`Event`	HTML5 media	The user agent is trying to fetch media data, but data is unexpectedly not forthcoming.
`start` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`Event`	Web Speech API	The speech recognition service has begun listening to incoming audio with intent to recognize grammars associated with the current `SpeechRecognition`.
`start`	`SpeechSynthesisEvent`	Web Speech API	The utterance has begun to be spoken.
`storage`	`StorageEvent`	Web Storage	A storage area (localStorage or sessionStorage) has changed.
`submit`	`Event`	DOM L2, HTML5	A form is submitted.
`success`	`Event`	IndexedDB	A request successfully completed.
`suspend`	`Event`	HTML5 media	Media data loading has been suspended.
`SVGAbort`	`SVGEvent`	SVG	Page loading has been stopped before the SVG was loaded.
`SVGError`	`SVGEvent`	SVG	An error has occurred before the SVG was loaded.
`SVGLoad`	`SVGEvent`	SVG	An SVG document has been loaded and parsed.
`SVGResize`	`SVGEvent`	SVG	An SVG document is being resized.
`SVGScroll`	`SVGEvent`	SVG	An SVG document is being scrolled.
`SVGUnload`	`SVGEvent`	SVG	An SVG document has been removed from a window or frame.
`SVGZoom`	`SVGZoomEvent`	SVG	An SVG document is being zoomed.
`timeout`	`ProgressEvent`	XMLHttpRequest
`timeupdate`	`Event`	HTML5 media	The time indicated by the `currentTime` attribute has been updated.
`touchcancel`	`TouchEvent`	Touch Events	A touch point has been disrupted in an implementation-specific manners (too many touch points for example).
`touchend`	`TouchEvent`	Touch Events	A touch point is removed from the touch surface.
`touchmove`	`TouchEvent`	Touch Events	A touch point is moved along the touch surface.
`touchstart`	`TouchEvent`	Touch Events	A touch point is placed on the touch surface.
`transitionend`	`TransitionEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	CSS Transitions	A CSS transition has completed.
`unload`	`UIEvent`	DOM L3	The document or a dependent resource is being unloaded.
`upgradeneeded`		IndexedDB	An attempt was made to open a database with a version number higher than its current version. A `versionchange` transaction has been created.
`userproximity`	`UserProximityEvent` Это экспериментальное API, которое не должно использоваться в рабочем коде.	Proximity Sensor	Fresh data is available from a proximity sensor (indicates whether the nearby object is `near` the device or not).
`voiceschanged` Это экспериментальное API, которое не должно использоваться в рабочем коде.	`Event`	Web Speech API	The list of `SpeechSynthesisVoice` objects that would be returned by the `SpeechSynthesis.getVoices()` method has changed (when the `voiceschanged` event fires.)
`versionchange`		IndexedDB	A `versionchange` transaction completed.
`visibilitychange`	`Event`	Page visibility	The content of a tab has become visible or has been hidden.
`volumechange`	`Event`	HTML5 media	The volume has changed.
`waiting`	`Event`	HTML5 media	Playback has stopped because of a temporary lack of data.
`wheel`	`WheelEvent`	DOM L3	A wheel button of a pointing device is rotated in any direction.

Обзор событий и обработчиков — Руководства Web-разработчика

Эта обзорная статья о событиях и их обработчиках описывает шаблон проектирования кода, который используется для реагирования на события, возникающие, когда браузер получает доступ к web-странице, и содержит подборку типов подобных событий, которые современные брауезеры могут обрабатывать.

События и их обработчики представляют собой основную технику в JavaScript для реагирования на события, возникающие, когда браузер получает доступ к web-странице, включая события о подготовке страницы к отображению, взаимодействии с ее содержимым, в зависимости от устройства, на котором браузер был запущен, и многие другие случаи, такие как воспроизведение потоковой медиа-информации или расчет времени анимации.

События и обработчики событий заняли центральное место в web-программировании с добавлением языка в браузеры, сопровождая смену архитектуры рендеринга от перехвата и загрузки страницы к управлению с помощью событий, основанном на перекомпановке (reflow). Сначала браузер ожидает, пока он получит все ресурсы, связанные со страницей, чтобы проанализировать, обработать, отрисовать и предоставить страницу пользователю. Отрисованная страница остается неизменной, пока браузер не запросит новую. С изменением в подходе к рендерингу динамической страницы, браузер непрерывно зацикливается между обработкой, отрисовкой, представлением содержимого и ожиданием некоторого нового триггера события. Триггеры событий включают, например, завершение загрузки ресурса по сети, скачивание изображений, которые теперь могут быть отрисованы на экране, завершение браузером анализа ресурса, обработку HTML-содержимого страницы, взаимодействие пользователя с содержимым страницы, нажатия кнопок. Дуглас Крокфорд хорошо объясняет это изменение в нескольких лекциях, особенно своей речи «Неудобные API: Теория DOM», которая описывает изменения в потоке изначального потока браузера от управляемого событиями браузера.

Второй подход изменяет последние шаги, переходя от просторого потока к бесконечному циклу, где ожидание и обработка возникновения новых событий следует за отрисовкой. Введение динамического подхода позволяет странице быть частично отрендериной, даже когда браузер еще не закончил извлечение всех ресурсов; это так же разрешено для действий, управляемыми событиями, которые JavaScript использует. (Речь доступна на нескольких ресурсах, включая этот.) На данный момент, все среды исполнения JavaScript используют события и их обработчики.

Система событий, по своей сути, простой программный шаблон проектирования. Он начинается с соглашения о виде события и:

имени-строки, используемой для собыйтия,
типа структуры данных, используемых для представления ключевых свойств события,
объекта JavaScript, который будет ‘вызывать’ это событие.

Шаблон реализуется с помощью:

определение JavaScript-функции, которая принимает в качестве аргумента структуру данных, которая была согласована ранее, и
регистрации функции с помощью имени-строки через объект, который будет вызывать событие.

Функция считается «слушателем» или «обработчиком», где оба именами взаимнозаменяемы. Этому шаблону можно легко следовать с использованием полностью пользовательского кода, как объяснено в статье о пользовательских событиях. Шаблон так же используется современными web-браузерами, определяющими множество событий, которые вызываются в ответ на пользовательский ввод или активность браузера.

Современные браузеры следуют событийному шаблону, используя стандартизированный подход. В качестве структуры данных для свойств события они применяют объект, полученный от объекта EventPrototype. Для регистратрации функции, которая будет обрабатывать эту структуру даных, используется метод, называемый addEventListener, который ожидает в качестве аргумента имя-строку, соответствующую типу события, и функцию-обработчика. В итоге, браузеры определяют огромное число объектов источников событий и широкое разнообразие типов событий, сформированных объектами.

К примеру, браузерный элемент button предназначен для вызова события с именем 'click' в ответ на нажатие кнопки мыши или прикосновене пальца к чувствительной части экрана. В HTML мы можем определить button как:

<button>Click here to emit a 'click' event</button>

и, в коде JavaScript, мы можем сначала определить функцию для прослушивания этого события 'click' :

var example_click_handler = function (ev){
    var objKind = (ev instanceof Event) ? "EventPrototype" : "ObjectPrototype";
    alert("We got a click event at " + ev. timeStamp + " with an argument object derived from: " + objKind );
};

и затем зарегестрировать свою функцию с помощью объекта Button или со стороны скрипта, используя представление DOM (Document Object Model) на HTML-странице:

var buttonDOMElement = document.querySelector('#buttonOne');
buttonDOMElement.addEventListener('click', example_click_handler);

или на самой HTML-странице, добавив функцию как значение атрибута 'onclick', хотя этот вариант обычно используется на очень простых web-страницах.

Этот код полагается на соглашение о том, что существует некоторый вид события, называемый 'click' , который вызовет все функции-слушатели (или ‘обработчи’) с объектом-аргументом Event (на данный момент, в этом случае производный от объекта MouseEvent ) и будет запущен после манипуляций пользователя с элементами button на HTML-странице. Код не имеет видимого воздействия, пока пользователь не использует кнопки, наводит указатель мыши на элемент HTML и нажимает на левую кнопку или устанавливает палец или стилус на некоторое место на экране, выше кнопки; когда это произойдет, buttonDOMElement объекта JavaScript вызовет функцию example_click_handler с объектом Event в качестве аргумента. Функция, в свою очередь, исполнит любые действия, описанные программистом, в данном случае отрыв диалоговое окно HTML. Заметим, что обработчик имеет доступ к объекту ev, так как тот передается в качестве аргумента; объект содержит информацию о событие, в частности время его возникновения.

Во втором варианте, интегрирован в web-страницу намного более современный JavaScript обернут в событийный вызов функции, чтобы убедиться, что код будет выполнен только тогда, когда HTML будет обработан и доступен для изменения или декорирования. Например, код может быть объявлен так:

var funcInit = function(){
    
    
}
document.addEventListener('DOMContentLoaded', funcInit);

так что этот код будет вызван только после того, как объект document вызовет событие 'DOMContentLoaded', потому что HTML был проанализирован и были созданы объекты Javasript, представляющие каждый узел HTML-документа. Заметим, что в этом примере, код даже не передает аргумент события в функцию, потому что тому никогда не понадобится использовать данные, описанные в нем; скорее, код всего лишь нужно подождать, пока не случится событие.

Шаблон легко изучить и внедрить. Сложность с событиями возникает из-за необходимости изучить большое разнообразие событий, которые представлены в современных web-браузерах. Так же есть некоторая сложность в понимании, как писать обработчики, так как данный код работает ассинхронно и потенциально может быть вызван несколько раз подряд, но в немного другой ситуации.

Web-браузеры определяют большое число событий, поэтому не практично описывать их все. Event Reference призван содержать список стандартных событий, используемых в современных браузерах.

В общем случае, события различного вида выделяют, основываясь на объекте, который вызывает данное событие, включая:

объект window, на случай изменения размера браузера,
объект window.screen, на случай изменения положения устройства,
объект document, включая загрузку, модификацию, пользовательское взаимодействие и разгрузку страницы,
объект в DOM (объектная модель документа) дереве, включая пользовательское взаимодействие или изменения,
объект XMLHttpRequest, используемый для запросов сети, и
медиа-объекты, такие как audio и video, когда медиа-потоковые плееры изменяют состояние.

хотя этот список на данный момент неполный.

Некоторые события, которые стоит отметить:

Заметка: Этот список событий будет нуждаться в доработке, чтобы соответствовать действительности; эта работа ожидает некоторой глобальной реорганизации в документе. Так же нужно найти хорошее объяснение событий, включая события во время загрузки страницы, таких, как частично описаных в этой статье или этом вопросе на Stack Overflow.

глобальный объект window вызывает событие, называемое 'load', когда страница закончила рендеринг, подразумевая, что все ресурсы были скачаны и применены, так что скрипт был выполнен и изображения отображены,
глобальный объект window вызывает событие, называемое 'resize', когда высота или ширина окна браузера была измененеа пользователем,
объект DOM document, представляющий HTML-документ, вызывает событие, называемое 'DOMContentLoaded', когда документ закончил загрузку,
объект узла DOM, такой как div или button, вызывающий событие, называемое 'click', когда пользователь нажимает кнопку мыши, пока ее указатель находится поверх узла DOM на HTML-странице.

Web-браузер определяет множество событий различного вида. Каждое описание включает, как структуру данных, передающуюся в обработчика, объект, который наследуется от объекта EventPrototype.

Частичная диаграма иерархии класса объекта событий:

Заметка: Эта диаграма неполная.

Web API Документация содержит страницу, описывающую объект событий, который так же включает известные события DOM, подклассы объекта Event.

Три ресурса на MDN (Mozilla Developer Network) частично полезные для программистов, желащих работать с событиями:

Список родных событий Javascript

Событие	Обработчик события	Поддерживающие HTML-элементы	Описание
События мыши
click	onClick	* Практически все HTML-элементы	Одинарный щелчок (нажата и отпущена кнопка мыши)
dblclick	onDblClick	* Практически все HTML-элементы	Двойной щелчок
contextmenu	onContextmenu	* Практически все HTML-элементы	Щелчок правой кнопкой мыши на элементе
selectstart	onselectstart	* Практически все HTML-элементы	Начало выделения контента. Изменение выделения скриптом.
mousewheel	onMousewheel	* Практически все HTML-элементы	Нажата кнопка мыши в пределах текущего элемента
mousemove	onMouseMove	* Практически все HTML-элементы	Перемещение курсора мыши в пределах текущего элемента
mouseout	onMouseOut	* Практически все HTML-элементы	Курсор мыши выведен за пределы текущего элемента
mouseover	onMouseOver	* Практически все HTML-элементы	Курсор мыши наведен на текущий элемент
mouseup	onMouseUp	* Практически все HTML-элементы	Отпущена кнопка мыши в пределах текущего элемента
mousedown	onMouseDown	* Практически все HTML-элементы	Нажата кнопка мыши в пределах текущего элемента
События клавиатуры
keydown	onKeyDown	* Практически все HTML-элементы	Нажата клавиша на клавиатуре
keypress	onKeyPress	* Практически все HTML-элементы	Нажата и отпущена клавиша на клавиатуре
keyup	onKeyUp	* Практически все HTML-элементы	Отпущена клавиша на клавиатуре
События элементов форм
focus	onFocus	A, AREA, BUTTON, INPUT, LABEL, SELECT, TEXTAREA	Получение элементом фокуса (щелчок мышью на элементе или очередное нажатие клавиши табуляции)
blur	onBlur	A, AREA, BUTTON, INPUT, LABEL, SELECT, TEXTAREA	Потеря текущим элементом фокуса, т. е. переход к другому элементу. Возникает при щелчке мышью вне элемента либо нажатии клавиши табуляции
change	onChange	INPUT, SELECT, TEXTAREA	Изменение значений элементов формы. Возникает после потерей элементом фокуса, т.е. после события blur
reset	onReset	FORM	Сброс данных формы ( щелчок по кнопке <input type=»reset»> )
select	onSelect	INPUT, TEXTAREA	Выделение текста в текущем элементе
submit	onSubmit	FORM	Отправка данных формы ( щелчок по кнопке <input type=»submit»> )
abort	onAbort	IMG, input type=»img»	Прерывание загрузки изображения
События окна браузера
load	onLoad	BODY, FRAMESET	Закончена загрузка документа
unload	onUnload	BODY, FRAMESET	Попытка закрытия окна браузера и выгрузки документа
error	onError	IMG, WINDOW	Возникновение ошибки выполнения сценария
move	onMove	WINDOW	Перемещение окна
resize	onResize	WINDOW	Изменение размеров окна
scroll	onScroll	* Практически все HTML-элементы	Прокрутка окна или области

Все обработчики событий JavaScript — полный список с описанием

21.

08.18 JavaScript 864

Для оживления веб-страниц широко используется язык JavaScript. В этом языке существуют специальные события, которые происходят в определенный момент времени при выполнении каких-либо действий. Обработчиков событий достаточно много, также были введены новые HTML5 обработчики событий.

Полный список обработчиков событий приводится ниже. Выполнение кода обработчика запускается, когда выполнено условие:

onabort – прерывание воспроизведения;
onafterprint – закончена печать;
onautocomplete – выполнено автозаполнение формы;
onautocompleteerror – ошибка при автозаполнении формы;
onbeforeprint – подготовка к печати;
onbeforeunload — документ выгружен;
onblur – потеря фокуса;
oncancel – отмена действия;
oncanplay — можно начать воспроизведение указанного медиа-файла;
oncanplaythrough — можно начать воспроизведение указанного медиа-файла без необходимости остановки для буферизации;
onchange – изменение значения;
onclick – клик на элементе;
onclose – закрытие чего-либо;
oncontextmenu – открытие контекстного меню;
oncopy – выполнено копирование;
oncuechange — изменение метки в элементе track;
oncut – выполнено вырезание контента;
ondblclick – двойной клик на элементе;
ondrag — перетаскивание элемента;
ondragend — перетаскивание элемента завершено;
ondragenter — элемент перетаскивается в допустимую целевую зону;
ondragexit – выход из режима перетаскивания;
ondragleave — элемент оставляет допустимую цель;
ondragover — элемент перетаскивается по допустимой целевой точке;
ondragstart – начало операции перетаскивания;
ondrop – перетаскиваемый элемент отпущен;
ondurationchange — изменение длины носителя;
onemptied – файл неожиданно стал недоступен;
onended – воспроизведение завершено;
onerror – произошла ошибка;
onfocus – установка фокуса на элементе;
onhashchange — изменение привязки части адреса;
oninput – начало ввода данных;
oninvalid – элемент поврежден;
onkeydown – нажата клавиша;
onkeypress — нажата клавиша и затем отпущена;
onkeyup – отпущена клавиша;
onload – элемент загружен;
onloadeddata – загружены данные файла;
onloadedmetadata – загружены метаданные файла;
onloadstart – начало загрузки элемента;
onmessage — появление сообщения;
onmousedown – нажата клавиша мыши;
onmouseenter – указатель мыши наведен на элемент;
onmouseleave – указатель мыши покинул элемент;
onmousemove — указатель мыши перемешен над элементом;
onmouseout — указатель мыши перемещается из элемента;
onmouseover — указатель мыши перемещается по элементу;
onmouseup — кнопка мыши отпускается над элементом;
onmousewheel (onwheel) – использовано колесико мыши;
onoffline – браузер запущен в оффлайн режиме;
ononline – браузер запущен в онлайн режиме;
onpagehide — пользователь переходит от страницы;
onpageshow — пользователь переходит на страницу;
onpaste – выполнена вставка контента;
onpause – приостановка воспроизведения;
onplay – начало воспроизведения;
onplaying – воспроизведения файла;
onpopstate — изменение истории окна;
onprogress – получение метаданных файла;
onratechange — изменение скорости воспроизведения;
onreset – выполнен сброс данных;
onresize – изменение размера элемента;
onscroll – прокрутка содержимого элемента;
onsearch – выполнен поиск;
onseeked — поиск закончился;
onseeking – поиск активен;
onselect – выбор некоторого текста или значения;
onshow – показ элемента;
onsort – выполнение сортировки;
onstalled — браузер не может получить мультимедийные данные по любой причине;
onstorage – обновлено веб-хранилище;
onsubmit – подтверждение отправки данных формы;
onsuspend – остановка извлечения метаданных;
ontimeupdate – изменение позиции (времени) воспроизведения файла, то есть перемотка файла;
ontoggle — пользователь открывает или закрывает элемент details;
onunload – загрузка выполнена, после чего произошло закрытие документа;
onvolumechange – громкость изменена;
onwaiting – ожидание восстановления воспроизведения.

Обработчики событий следует использовать правильным образом, желательно не писать их напрямую в атрибутах тегов, а устанавливать обработчики событий в подключаемых файлах с JavaScript-кодом. Если используется библиотека jQuery, то название обработчиков необходимо писать без префикса on. Таким образом, были рассмотрены все обработчики событий JavaScript, приведен полный список событий с описанием.

События в Javascript

HTML события это такая «вещь», которая временами происходит с HTML элементами.

HTML событие может быть неким действием, которое делает браузер или пользователь.

При использовании на HTML странице скрипта JavaScript он может реагировать на эти события.

Вот несколько примеров HTML событий:

HTML страница закончила загружаться
Поле ввода было изменено
Пользователь нажал на HTML кнопку

Часто, при возникновении HTML события необходимо что-то сделать. JavaScript позволяет при обнаружении нужного события выполнить необходимый код. Для этого у HTML элементов есть специальные атрибуты обработчики событий, в которые и можно добавить JavaScript код:

С одинарными кавычками:
элемент событие=’код JavaScript‘>

С двойными кавычками:
<элемент событие=»код JavaScript«>

В следующем примере элементу button добавлен атрибут onclick с JavaScript кодом:


<button>
	Какая сейчас дата и время?
</button>

В приведенном примере при нажатии пользователем на кнопку код JavaScript изменит содержимое элемента с id=»demo» и выведет в него текущую дату и время.

В следующем примере JavaScript код изменит содержимое самого элемента (используется команда this.innerHTML):


<button>
	Какая сейчас дата и время?
</button>

Однако, очень редко можно увидеть код JavaScript, состоящий из одного выражения. Поэтому обычно в атрибут события записывают вызов JavaScript функции:


<button>
	Какая сейчас дата и время?
</button>

Часто используемые HTML события

Ниже приводится список некоторых часто используемых HTML событий:

Событие	Описание
onchange	HTML элемент был изменен
onclick	Пользователь кликнул мышкой на HTML элемент
onmouseover	Пользователь навел мышку на HTML элемент
onmouseout	Пользователь вывел мышку за пределы HTML элемента
onkeydown	Пользователь нажал на клавишу клавиатуры
onload	Браузер закончил загружать страницу

Конечно, список событий гораздо длиннее. Смотрите раздел События HTML DOM и HTML атрибуты-события.

Что может делать JavaScript с событиями?

Обработчик событий можно использовать для обработки и проверки пользовательского ввода, действий пользователя и браузера:

Выполнять действия повторяющиеся после загрузки страницы
Выполнять действия повторяющиеся после закрытия страницы
Действия, которые должны выполняться при нажатии пользователем на кнопку
Проверка данных, введенных пользователем в поле формы
И многое другое . ..

В JavaScript существует множество способов работать с событиями:

HTML атрибуты-события могут напрямую выполнять код JavaScript
HTML атрибуты-события могут вызывать функции JavaScript
Вы можете установить собственную функцию обработки события
Вы можете запретить отправку и обработку события
И многое другое …

Строка (объект String) Вверх Область видимости в Javascript

JS JavaScript HTML DOM События

HTML DOM позволяет JavaScript реагировать на события HTML:

Реагирование на события

JavaScript может быть выполнен при возникновении события, например, когда пользователь щелкает элемент HTML.

Чтобы выполнить код, когда пользователь щелкает элемент, добавьте код JavaScript в атрибут события HTML:

Примеры событий HTML:

Когда пользователь щелкает мышью
При загрузке веб-страницы
Когда изображение было загружено
Когда мышь перемещается над элементом
При изменении поля ввода
При отправке HTML-формы
Когда пользователь обгладит клавишу

В этом примере содержимое элемента <h2> изменяется, когда пользователь щелкает по нему:

Пример

<h2>Click on this text!</h2>

</body>
</html>

В этом примере функция вызывается из обработчика событий:

Пример

<h2>Click on this text!</h2>

</body>
</html>

Атрибуты события HTML

Для назначения событий элементам HTML можно использовать атрибуты событий.

Пример

Assign an onclick event to a button element:

В приведенном выше примере функция с именем DisplayDate будет выполняться при нажатии кнопки.

Назначение событий с помощью HTML DOM

HTML DOM позволяет назначать события элементам HTML с помощью JavaScript:

Пример

Назначьте событие OnClick элементу Button:

В приведенном выше примере функция с именем DisplayDate присваивается HTML-элементу с идентификатором = «myBtn».

Функция будет выполнена при нажатии кнопки.

События OnLoad и Unload

События OnLoad и Unload инициируются, когда пользователь вводит или покидает страницу.

Событие OnLoad может использоваться для проверки типа браузера посетителя и версии браузера и загрузки соответствующей версии веб-страницы на основе информации.

События OnLoad и Unload могут использоваться для борьбы с файлами cookie.

Пример

Событие onChange

Событие onChange часто используется в сочетании с проверкой полей ввода.

Ниже приведен пример использования OnChange. Функция верхнего регистра () будет вызываться, когда пользователь изменяет содержимое поля ввода.

Пример

События наведении курсора мыши

Для запуска функции при наведении курсора мыши на элемент HTML или из него можно использовать события наведении курсора мыши и onmouse:

Mouse Over Me

События OnMouseDown, OnMouseUp и OnClick

События OnMouseDown, OnMouseUp и OnClick являются частями щелчка мышью. Во-первых, при нажатии кнопки мыши, инициируется событие OnMouseDown, затем, когда кнопка мыши освобождается, инициируется событие OnMouseUp, и, наконец, когда щелчок мыши завершается, инициируется событие OnClick.

Click Me

Ссылка на объект события HTML DOM

Чтобы просмотреть список всех событий HTML DOM, посмотрите на нашу полную ссылку на объект события HTML DOM.

JavaScript — Виды событий — ИТ Шеф

На этом уроке мы рассмотрим основные виды событий, которые Вы можете перехватывать с помощью JavaScript для выполнения некоторого кода.

Все события JavaScript можно разделить на следующие категории: события мыши (Mouse Events), события клавиатуры (Keyboard Events), события объектов и фреймов (Frame/Object Events), события формы и элементов управления (Form Events), события перетаскивания (Drag Events), события анимации (Animation Events), события буфера обмена (Clipboard Events), события мультимедиа (Media Events), события трансформации (Transition Events), события, посылаемые сервером (Server-Sent Events), события касания (Touch Events), события печати (Print Events), разные события (Misc Events).

Внимание: все события в JavaScript пишутся строчными (маленькими) буквами.

mousedown — событие происходит, когда кнопка мыши нажата над некоторым элементом, но ещё не отпущена.
mouseup — событие происходит, когда кнопка мыши над некоторым элементом перешла из состояния нажатия, в состояние отпущена.
click — событие происходит, когда пользователь кликнул мышью на элементе. Порядок возникновения событий, связанных с click (для левой и средней кнопки мыши): mousedown -> mouseup -> click.
contextmenu — событие происходит, когда пользователь кликнул правой кнопкой мышью на элементе. Порядок возникновения событий, связанных с contextmenu (для правой кнопки мыши): mousedown -> mouseup -> contextmenu.
dblclick — событие происходит, когда пользователь выполнил двойной клик на элементе. Порядок возникновения событий, связанных с dblclick: mousedown -> mouseup -> click -> mousedown -> mouseup -> click -> dblclick.
mouseover — событие происходит, когда курсор мыши входит в область, принадлежащей элементу или одному из его детей.
mouseout — событие происходит, когда курсор мыши уходит из области, принадлежащей элементу или одному из его детей.
mousemove — событие происходит, когда курсор мыши перемещается внутри области, принадлежащей элементу.
mouseenter — событие возникает, когда указатель мыши входит в область, принадлежащую элементу. Это событие часто используется вместе с событием mouseleave, которое происходит, когда указатель мыши уходит из области, принадлежащей элементу. Событие mouseenter подобно событию mouseover и отличается от него только тем, что событие mouseenter не всплывает (с понятием всплытия события мы познакомимся немного позже).
mouseleave — событие происходит, когда указатель мыши уходит из области, принадлежащей элементу. Событие mouseleave подобно событию mouseout и отличается от него только тем, что событие mouseleave не всплывает (с понятием всплытия события мы познакомимся немного позже).

Порядок возникновения событий: keydown -> keypress -> keyup.

keydown — событие происходит, когда нажата клавиша на клавиатуре над элементом, но ещё не отпущена.
keyup — событие происходит, когда нажатая клавиша на клавиатуре над элементом перешла в состояние отпущено.
keypress — событие происходит, когда пользователь нажал клавишу на клавиатуре над элементом.

beforeunload — событие происходит, перед тем как документ будет выгружен. Это событие позволяет отображать дополнительное сообщение в диалоговом окне подтверждения «Вы действительно хотите покинуть эту страницу?». Стандартное сообщение, которое появляется при закрытии документа, может отличаться в разных браузерах. Но его Вы не можете изменить или удалить, Вы можете только с помощью этого метода добавить к нему собственное сообщение, которое будет отображаться вместе с сообщением по умолчанию.
error — событие срабатывает при возникновении ошибки, которая происходит при загрузке внешнего файла (например, документа или изображения).
hashchange — событие происходит при изменении якорной части (начинается с символа ‘#’) текущего URL.
load — событие происходит, когда загрузка объекта завершена. Событие load наиболее часто используется для элемента body, чтобы выполнить сценарий сразу же после того как веб-страница полностью загрузится.
unload — событие происходит при выгрузке страницы (например, при закрытии вкладки (окна) браузера).
pageshow — событие происходит, когда пользователь переходит на веб-страницу, т.е. после того как страница становится доступна пользователю. Событие pageshow похоже на событие load, за исключением того, что оно срабатывает каждый раз при загрузке страницы, даже если она загружается из кэша. При первой загрузке страницы событие pageshow срабатывает сразу после события load.
pagehide — событие происходит, когда пользователь уходит со страницы (событие pagehide происходит до события unload). Кроме этого данное событие, в отличие от события unload не препятствует кэшированию страницы.
resize — событие происходит при изменении размеров окна браузера.
scroll — событие происходит, когда вы прокручиваете содержимое элемента, имеющего полосу прокрутки.

focus — событие происходит, когда элемент получает фокус. Данное событие не всплывает.
blur — событие происходит, когда объект теряет фокус. Данное событие не всплывает.
focusin — событие происходит, когда элемент получает фокус. Событие focusin подобно событию focus, но отличается от него тем, что оно всплывает. Поэтому его можно использовать, когда Вам необходимо выяснить, кто теряет фокус: элемент или его ребёнок?
focusout — событие происходит, когда элемент собирается потерять фокус. Событие focusout подобно событию blur, но отличается от него тем, что оно всплывает. Поэтому его можно использовать, когда Вам необходимо выяснить, кто теряет фокус: элемент или его ребёнок?
change — событие происходит при изменении значения элемента, но уже после того как элемент потерял фокус. Кроме события change в JavaScript есть также похожее событие input, которое отличается от события change тем, что происходит сразу же после изменения значения элемента. Событие сhange в отличие от события input также работает с элементами keygen и select. Для радиокнопок (radiobuttons) и флажков (checkboxes) событие change происходит при изменении состояния этих элементов.
input — событие происходит после того как изменяется значение элемента input или элемента textarea.
invalid — событие происходит, когда элемент input, данные которого необходимо отправить вместе с другими данными формы на сервер, содержит недопустимые данные.
reset — событие происходит перед очисткой формы, которая осуществляется элементом input с type="reset".
search — событие возникает после того как пользователь нажимает на клавишу Enter или нажимает кнопку «x» (отмена) в элементе input с type="search".
select — событие происходит после того как Вы выбрали некоторый текст в элементе. Событие select в основном используется для элемента input с type="text" или textarea.
submit — событие происходит перед отправкой формы на сервер.

События, связанные с перетаскиваемым объектом (draggable target, исходный объект):

dragstart – событие происходит, когда пользователь начал перетаскивать элемент;
drag – событие происходит, когда пользователь перетаскивает элемент;
dragend – событие происходит, когда пользователь закончил перетаскивания элемента, т.е. когда отпустил курсор мыши.

События, связанные с объектом (drop target), который принимает перетаскиваемый объект (draggable target):

dragenter – событие происходит, когда перетаскиваемый объект (draggable target) вошёл в область элемента (drop target), который может принять перетаскиваемый объект (draggable target).
ragleave – событие происходит, когда перетаскиваемый объект (draggable target) покидает пределы элемента (drop target), который может его принять.
dragover — событие происходит, когда перетаскиваемый объект (draggable target) перемещается в области элемента (drop target), который может его принять.
drop — событие происходит, когда пользователь отпускает перетаскиваемый объект (draggable target) в область элемента (drop target), который может его принять.

Три события, которые могут произойти, во время выполнения CSS анимации:

animationstart — возникает, когда анимация CSS началась.
animationiteration — возникает, когда анимация CSS выполняется повторно.
animationend — возникает, когда CSS анимация закончилась.

сopy — событие происходит, когда пользователь копирует содержимое элемента. Событие copy также происходит, когда пользователь копирует элемент (например, изображения, созданные с помощью элемента img). Событие copy используется в основном для элементов input с type="text".
сut — событие происходит, когда пользователь вырезает содержимое элемента.
paste — событие происходит, когда пользователь вставляет некоторое содержимое в элемент.

afterprint — событие происходит, когда страница начинает печататься (т.е. после нажатия кнопки «Печать» в диалоговом окне) или если диалоговое окно «Печать» было закрыто.
beforeprint — событие возникает перед печатью страницы, т.е. до открытия диалогового окна «Печать».

transitionend — событие возникает, когда CSS-переход завершен. Примечание: если переход удален до завершения, (например, если свойство CSS transition-property удалено), то событие transitionend не сработает.

error — событие возникает при возникновении ошибки с источником события. Ошибка обычно возникает, когда связь нарушается. Если это произойдет, то объект EventSource будет автоматически пытаться подключиться к серверу.
open — событие возникает, когда соединение с источником события открыто.
message — событие возникает, когда сообщение получено через источник события.
Объект event события message поддерживает следующие свойства:
- data — содержит сообщение.
- origin — URL документа, который вызвал событие.
- lastEventId — идентификатор (id) последнего полученного сообщения.

В процессе загрузки аудио/видео события происходят в следующем порядке: loadstart -> durationchange -> loadedmetadata -> loadeddata -> progress -> canplay -> canplaythrough.

abort — событие возникает, когда прерывается загрузка аудио/видео. Это событие возникает именно когда загрузка медиа данных была прервана (отменена), а не, потому что возникла ошибка.
error — событие возникает, когда произошла ошибка при загрузке аудио/видео.
stalled — событие возникает, когда браузер пытается получить медиа данные, но данные недоступны.
suspend — событие возникает, когда браузер не может получить медиа данные, т.е. загрузка медиа останавливается по какой-то причине.
loadstart — событие происходит, когда браузер начинает искать указанное аудио/видео, т.е. когда начинается процесс загрузки.
durationchange — событие возникает, когда изменяется длительность аудио/видео. Если аудио/видео загружается, то длительность будет меняться от значения «NaN» до фактической длительности аудио/видео.
loadedmetadata — событие возникает, когда метаданные для указанного аудио/видео загружены. Метаданные аудио/видео состоят из: длительности, размера (только видео) и текстовой дорожки.
loadeddata — событие возникает, после того как первый кадр медиа загрузился.
progress — событие происходит, когда браузер загружает указанное аудио/видео.
canplay — событие возникает, когда браузер может начать воспроизведение указанного аудио/видео (т.е. когда буферизация потока аудио/видео достаточна для того чтобы браузер мог начать его воспроизводить).
canplaythrough — событие возникает в тот момент времени, когда браузер может проигрывать указанное медиа без остановки на буферизацию.
ended — событие происходит, когда воспроизведение аудио/видео завершилось (достигло конца). Это событие может использоваться для вывода сообщений типа «Спасибо за внимание», «Спасибо за просмотр» и др.
pause — событие происходит, когда воспроизведение аудио/видео приостановлено пользователем или с помощью кода (программно).
play — событие происходит, когда начинается воспроизведение аудио/видео. Оно также происходит, когда аудио/видео было снято с паузы и начинает воспроизводиться.
playing — событие происходит, когда аудио/видео воспроизводится после того как оно было поставлено на паузу или остановилось для буферизации.
ratechange — событие происходит, когда изменяется скорость воспроизведения аудио/видео.
seeking — событие происходит, когда пользователь начинает перемещение ползунка (переход) к новой временной позиции проигрываемого аудио/видео.
seeked — событие происходит, когда пользователь закончил перемещение ползунка (переход) в новую временную позицию проигрываемого аудио/видео. Событие seeked противоположно событию seeking. Для того чтобы получить текущую позицию воспроизведения, используйте свойство currentTime объекта Audio/Video.
timeupdate — событие происходит при изменении временной позиции воспроизводимого аудио/видео.
Это событие происходит:
- при воспроизведении потока аудио/видео.
- при перемещении ползунка в новую временную позицию воспроизводимого аудио/видео.
Событие timeupdate часто используется вместе со свойством объекта Audio/Video currentTime, которое возвращает текущую временную позицию воспроизводимого аудио/видео в секундах.
volumechange – событие происходит каждый раз при изменении громкости воспроизводимого потока видео/аудио.
Это событие происходит, при:
- увеличении или уменьшении громкости;
- отключении или включении звука.
waiting — событие происходит, когда видео останавливается для буферизации.

toggle — событие происходит, когда пользователь открывает или закрывает элемент details. Элемент details предназначен для создания дополнительных сведений, которые пользователь при необходимости может просматривать или скрывать.
wheel — событие происходит при прокручивании колеса мыши вперёд или назад над элементом.

Является ли событие «Нажатие клавиши на клавиатуре (onkeypress)» сложным? И если является, то в результате, каких простых событий оно возникает?
Например, у Вас есть 2 элемента р и пользователь перемещает мышку с области, принадлежащей одному элементу р, на область, принадлежащую другому элементу р. То, какие в этом случае возникают события, и какие элементы их генерируют?

Ссылка на событие | MDN

Тип события	Описание	Документация
Анимация	События, связанные с API веб-анимации. Используется для ответа на изменения статуса анимации (например, когда анимация начинается или заканчивается).	Анимационные события запущены в `Document` , `Window` , `HTMLElement` .
Асинхронная выборка данных	События, связанные с получением данных.	События, запущенные на `AbortSignal` , `XMLHttpRequest` , `FileReader` .
Буфер обмена	События, связанные с API буфера обмена. Используется для уведомления, когда содержимое вырезано, скопировано или вставлено.	События, запущенные в документе , элементе , окне .
Состав	События, связанные с композицией; ввод текста «косвенно» (вместо обычного нажатия на клавиатуру). Например, текст, введенный с помощью механизма преобразования речи в текст или с помощью специальных комбинаций клавиш, которые изменяют нажатия клавиш для представления новых символов на другом языке.	События, запущенные на элементе .
CSS переход	События, связанные с переходами CSS. Предоставляет события уведомления, когда переходы CSS начинаются, останавливаются, отменяются и т. Д.	События, запущенные в `Document` , `HTMLElement` , `Window` .
База данных	События, связанные с операциями с базой данных: открытие, закрытие, транзакции, ошибки и т. Д.	События, запущенные на `IDBDatabase` , `IDBOpenDBRequest` , `IDBRequest` , `IDBTransaction` .
Drag’n’drop, Колесо	События, связанные с использованием HTML-API перетаскивания и событий колеса. События перетаскивания и колесика являются производными от событий мыши.Хотя они запускаются при использовании колесика мыши или перетаскивания, они также могут использоваться с другим подходящим оборудованием.	События перетаскивания, запущенные в документе События Wheel запущены в документе и элементе
Фокус	События, связанные с получением и потерей фокуса элементами.	События, запущенные для элемента , окна .
Форма	События, связанные с созданием, сбросом и отправкой форм.	События, запущенные на `HTMLFormElement` .
Полноэкранный режим	События, связанные с полноэкранным API. Используется для уведомления при переходе между полноэкранным и оконным режимами, а также об ошибках, возникающих во время этого перехода.	События, инициированные в `документе` , `элемент` .
Геймпад	События, связанные с Gamepad API.	События, запущенные в `Window` .
История	События, связанные с API истории.	События, запущенные в `Window` .
Управление отображением содержимого HTML-элемента	События, связанные с изменением состояния отображения или текстового элемента.	События, запущенные для `HTMLDetailsElement` , `HTMLDialogElement` , `HTMLSlotElement` .
Входы	События, связанные с элементами ввода HTML, например. , </code>. </p> </td> <td> События, запущенные на <code> HTMLElement </code>, <code> HTMLInputElement </code>. </td> </tr> <tr> <td> Клавиатура </td> <td> <p> События, связанные с использованием клавиатуры.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/4.bp.blogspot.com/-x6Dy0gPkHc8/WZ7UCc3W-1I/AAAAAAAAAi8/QpmL9jqWLtICadzCdlBL06m8VP9IgGDdwCK4BGAYYCw/s1600/tutor4.png' style='float: right;' /><noscript><img src='/800/600/https/4.bp.blogspot.com/-x6Dy0gPkHc8/WZ7UCc3W-1I/AAAAAAAAAi8/QpmL9jqWLtICadzCdlBL06m8VP9IgGDdwCK4BGAYYCw/s1600/tutor4.png' style='float: right;' /></noscript> </p> <p> Используется для уведомления, когда клавиши перемещаются вверх, вниз или просто нажимаются. </p> </td> <td> События, инициированные в <code> документе </code>, <code> элемент </code>.</td> </tr> <tr> <td> Погрузочно-разгрузочные документы </td> <td> <p> События, связанные с загрузкой и разгрузкой документов. </p> </td> <td> События <p> срабатывают в документе <code> </code> и в окне </code> <code>. </p> </td> </tr> <tr> <td> Манифест </td> <td> <p> События, связанные с установкой манифестов прогрессивных веб-приложений. </p> </td> <td> События, запущенные в <code> Window </code>. </td> </tr> <tr> <td> Медиа </td> <td> <p> События, связанные с использованием мультимедиа (включая Media Capture and Streams API, Web Audio API, Picture-in-Picture API и т. Д.). </p> </td> <td> События, запущенные на <code> ScriptProcessorNode </code>, <code> HTMLMediaElement </code>, <code> AudioTrackList </code>, <code> AudioScheduledSourceNode </code>, <code> MediaRecorder </code>, <code> MediaStream </code>, <code> MediaStreamTrack </code>, <code> VideoTrackList </code>lement </code>, Элемент / аудио, Элемент / видео.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/overcoder.net/img/1/4/67/36647.png' style='float: right;' /><noscript><img src='/800/600/https/overcoder.net/img/1/4/67/36647.png' style='float: right;' /></noscript> </td> </tr> <tr> <td> Сообщения </td> <td> <p> События, связанные с окном, получающим сообщение из другого контекста просмотра.</p> </td> <td> События, запущенные в <code> Window </code>. </td> </tr> <tr> <td> Мышь </td> <td> <p> События, связанные с использованием компьютерной мыши. </p> <p> Используется для уведомления при щелчке мышью, двойном щелчке, событиях вверх и вниз, щелчке правой кнопкой мыши, перемещении в элемент и из элемента, выделении текста и т. Д. </p> <p> События указателя предоставляют аппаратно-независимую альтернативу событиям мыши. События перетаскивания и колесика основаны на событиях мыши. </p> </td> <td> События мыши запущены на элементе <code> </code> </td> </tr> <tr> <td> Сеть / Подключение </td> <td> <p> События, связанные с получением и потерей сетевого подключения.</p> </td> <td> <p> События, запущенные в <code> Window </code>. </p> <p> События, запущенные на <code> NetworkInformation </code> (API сетевой информации). </p> </td> </tr> <tr> <td> Платежи </td> <td> <p> События, связанные с API запроса платежа.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/i.stack.imgur.com/oW7Yt.png' style='float: right;' /><noscript><img src='/800/600/https/i.stack.imgur.com/oW7Yt.png' style='float: right;' /></noscript> </p> </td> <td> <p> События, запущенные для <code> PaymentRequest </code>, <code> PaymentResponse </code>. </p> </td> </tr> <tr> <td> Производительность </td> <td> <p> События, связанные с API времени высокого разрешения, API временной шкалы производительности, API времени навигации, API времени пользователя и API синхронизации ресурсов.</p> </td> <td> <p> События запущены на <code> Performance </code>. </p> </td> </tr> <tr> <td> Указатель </td> <td> <p> События, связанные с API событий указателя. </p> <p> Предоставляет аппаратно-независимые уведомления от указывающих устройств, включая мышь, сенсорный экран, перо / стилус. </p> </td> <td> События, запущенные в <code> Document </code>, <code> HTMLElement </code>. </td> </tr> <tr> <td> Печать </td> <td> <p> События, связанные с печатью. </p> </td> <td> События, запущенные в <code> Window </code>.</td> </tr> <tr> <td> Отклонение обещания </td> <td> <p> События, отправляемые в глобальный контекст сценария, когда любое обещание JavaScript отклоняется.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/i.stack.imgur.com/pu8rZ.png' style='float: right;' /><noscript><img src='/800/600/https/i.stack.imgur.com/pu8rZ.png' style='float: right;' /></noscript> </p> </td> <td> События, запущенные в <code> Window </code>. </td> </tr> <tr> <td> Розетки </td> <td> <p> События, связанные с API WebSockets. </p> </td> <td> События запущены на <code> Websocket </code>. </td> </tr> <tr> <td> SVG </td> <td> <p> События, связанные с изображениями SVG. </p> </td> <td> <p> События, запущенные на <code> SVGElement </code>, <code> SVGAnimationElement </code>, <code> SVGGraphicsElement </code>.</p> </td> </tr> <tr> <td> Выбор текста </td> <td> <p> События, связанные с выделением текста. </p> </td> <td> <p> События инициированы в <code> документе </code>. </p> </td> </tr> <tr> <td> Сенсорный </td> <td> <p> События, связанные с Touch Events API. </p> <p> Предоставляет события уведомления при взаимодействии с сенсорным экраном (т. Е. С помощью пальца или стилуса). Не имеет отношения к Force Touch API. </p> </td> <td> События, инициированные в <code> документе </code>, <code> элемент </code>.</td> </tr> <tr> <td> Виртуальная реальность </td> <td> <p> События, связанные с API устройства WebXR.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/2.bp.blogspot.com/-B_YcOL4hQaQ/VKWZRd7GFdI/AAAAAAAAYBw/cF3uE_mFEEE/s1600/Slide3.PNG' style='float: right;' /><noscript><img src='/800/600/http/2.bp.blogspot.com/-B_YcOL4hQaQ/VKWZRd7GFdI/AAAAAAAAYBw/cF3uE_mFEEE/s1600/Slide3.PNG' style='float: right;' /></noscript> </p> </td> <td> События, запущенные на <code> XRSystem </code>, <code> XRSession </code>, <code> XRReferenceSpace </code>. </td> </tr> <tr> <td> RTC (связь в реальном времени) </td> <td> <p> События, связанные с API WebRTC. </p> </td> <td> События, запущенные на <code> RTCDataChannel </code>, <code> RTCDTMFSender </code>, <code> RTCIceTransport </code>, <code> RTCPeerConnection </code>.</td> </tr> <tr> <td> События, отправленные сервером </td> <td> <p> События, связанные с сервером отправленных событий API. </p> </td> <td> События, запущенные на <code> EventSource </code>. </td> </tr> <tr> <td> Выступление </td> <td> <p> События, связанные с Web Speech API. </p> </td> <td> События, запущенные на <code> SpeechSynthesisUtterance </code>. </td> </tr> <tr> <td> Рабочие </td> <td> <p> События, связанные с API Web Workers, API Service Worker, API Broadcast Channel и API обмена сообщениями.</p> <p> Используется для ответа на новые сообщения и ошибки отправки сообщений. Сервисные работники также могут быть уведомлены о других событиях, включая push-уведомления, нажатие пользователей на отображаемые уведомления, аннулирование push-подписки, удаление элементов из индекса содержимого и т.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/slideplayer.com/slide/14278517/89/images/12/JavaScript+Object+Notation+%28JSON%29%3A+The+Three+Slide+Introduction.jpg' style='float: right;' /><noscript><img src='/800/600/https/slideplayer.com/slide/14278517/89/images/12/JavaScript+Object+Notation+%28JSON%29%3A+The+Three+Slide+Introduction.jpg' style='float: right;' /></noscript> Д. </p> </td> <td> События, запущенные на <code> ServiceWorkerGlobalScope </code>, <code> DedicatedWorkerGlobalScope </code>, <code> SharedWorkerGlobalScope </code>, <code> WorkerGlobalScope </code>, <code> Worker </code>, <code> WorkerGlobalScope </code>, <code> BroadcastChannel </code>, <code> MessagePort </code>.</td> </tr> </table> <h2><span class="ez-toc-section" id="_-API"> Элемент: событие щелчка — веб-API </span></h2> <p> Элемент получает событие <code> <strong> click </strong> </code>, когда кнопка указывающего устройства (например, основная кнопка мыши) одновременно нажата и отпущена, когда указатель находится внутри элемента. </p> <p> Если кнопка нажата на одном элементе и указатель перемещается за пределы элемента до того, как кнопка будет отпущена, событие запускается на самом конкретном элементе-предке, который содержал оба элемента.</p> <p> <code> click </code> срабатывает после срабатывания событий <code> mousedown </code> и <code> mouseup </code> в указанном порядке. </p> <p> Объект <code> MouseEvent </code>, переданный в обработчик событий для <code> щелчка.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/slideplayer.com/slide/16478251/96/images/25/3.+Using+JavaScript+in+HTML+Tags..jpg' style='float: right;' /><noscript><img src='/800/600/https/slideplayer.com/slide/16478251/96/images/25/3.+Using+JavaScript+in+HTML+Tags..jpg' style='float: right;' /></noscript> </code> имеет свойство <code> detail </code>, установленное на количество нажатий на цель <code> </code>. Другими словами, <code> деталь </code> будет 2 для двойного щелчка, 3 для тройного щелчка и так далее. Этот счетчик сбрасывается через короткий промежуток времени без каких-либо щелчков; Специфика продолжительности этого интервала может варьироваться от браузера к браузеру и на разных платформах.На интервал также могут влиять предпочтения пользователя; например, параметры доступности могут увеличить этот интервал, чтобы упростить выполнение нескольких щелчков мышью с адаптивными интерфейсами. </p> <h4><span class="ez-toc-section" id="Internet_Explorer"> Internet Explorer </span></h4> <p> Internet Explorer 8 и 9 страдают от ошибки, при которой элементы с вычисленным цветом фона <code> </code> или <code> прозрачным </code>, которые накладываются поверх других элементов, не будут получать события <code> click </code>. Вместо этого любые события <code> click </code> будут запущены в базовых элементах.См. Этот живой пример для демонстрации. </p> <p> Известные обходные пути для этой ошибки: </p> <h4><span class="ez-toc-section" id="Safari_Mobile"> Safari Mobile </span></h4> <p> Safari Mobile 7.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/avatars.mds.yandex.net/get-zen_doc/3413538/pub_5ea70b8e4325171a6b4e3e83_5ea70c47ca32855cf8240914/scale_1200' style='float: right;' /><noscript><img src='/800/600/https/avatars.mds.yandex.net/get-zen_doc/3413538/pub_5ea70b8e4325171a6b4e3e83_5ea70c47ca32855cf8240914/scale_1200' style='float: right;' /></noscript> 0+ (и, вероятно, более ранние версии тоже) страдает ошибкой, из-за которой события <code> click </code> не запускаются для элементов, которые обычно не являются интерактивными (например, <code> <div> </code>) и которые также не работают. • иметь слушателей событий, непосредственно прикрепленных к самим элементам (т. е. используется делегирование событий). См. Этот живой пример для демонстрации. См. Также документацию Safari о том, как сделать элементы интерактивными, и определение «интерактивного элемента».</p> <p> Известные обходные пути для этой ошибки: </p> <ul> <li> Установить <code> курсор </code> <code>: указатель; </code> на элементе или на любом из его предков. </li> <li> Добавить фиктивный атрибут <code> onclick = "void (0)" </code> к элементу или любому из его предков, вплоть до <code> <body> </code>, но не включая его. </li> <li> Используйте обычно интерактивный элемент (например, <code> <a> </code>) вместо того, который обычно не является интерактивным (например, <code> <div> </code>).<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/efim360.ru/wp-content/uploads/corb-fetch-javascript-1024x499.png' style='float: right;' /><noscript><img src='/800/600/https/efim360.ru/wp-content/uploads/corb-fetch-javascript-1024x499.png' style='float: right;' /></noscript> </li> <li> Прекратить использование <code> щелкните </code> делегирование события.</li> </ul> <p> Safari Mobile считает, что следующие элементы обычно интерактивны (и поэтому эта ошибка не влияет на них): </p> <ul> <li> <code> <a> </code> (но он должен иметь <code> href </code>) </li> <li> <code> <area> </code> (но он должен иметь <code> href </code>) </li> <li> <code> <кнопка> </code> </li> <li> <code> <img> </code> </li> <li> <code> <вход> </code> </li> <li> <code> <label> </code> (но он должен быть связан с элементом управления формой) </li> <li> <code> <textarea> </code> </li> <li> <em> Этот список неполный; вы можете помочь MDN, проводя дальнейшие испытания / исследования и расширяя его.</em> </li> </ul> <p> В этом примере отображается количество последовательных нажатий на <code> <button> </code>. </p> <h4><span class="ez-toc-section" id="HTML"> HTML </span></h4> <h4><span class="ez-toc-section" id="JavaScript-2"> JavaScript </span></h4><pre> <code> const button = document.querySelector ('button'); button.addEventListener ('клик', event => { button.textContent = `Счетчик кликов: $ {event.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/myslide.ru/documents_3/c05f8ceb4a02adbf449f0146c267b5b3/img17.jpg' style='float: right;' /><noscript><img src='/800/600/https/myslide.ru/documents_3/c05f8ceb4a02adbf449f0146c267b5b3/img17.jpg' style='float: right;' /></noscript> detail}`; }); </code> </pre><h4><span class="ez-toc-section" id="i-13"> Результат </span></h4> <p> Попробуйте быстро и многократно нажимать кнопку, чтобы увеличить количество нажатий. Если вы сделаете перерыв между щелчками, счетчик сбрасывается.</p> <p> Таблицы BCD загружаются только в браузере </p> <h2><span class="ez-toc-section" id="_JavaScript-3"> События JavaScript </span></h2> <hr/> <p> HTML-события — это <strong> «вещи» </strong>, которые происходят с элементами HTML. </p> <p> Когда JavaScript используется на HTML-страницах, JavaScript может <strong> «реагировать» </strong> на эти события. </p> <hr/> <h3><span class="ez-toc-section" id="HTML-2"> HTML-события </span></h3> <p> Событие HTML может быть чем-то, что делает браузер или пользователем. </p> <p> Вот несколько примеров событий HTML: </p> <ul> <li> Веб-страница HTML завершила загрузку </li> <li> Поле ввода HTML было изменено </li> <li> Нажата кнопка HTML </li> </ul> <p> Часто, когда случаются события, вы можете захотеть что-то сделать.</p> <p> JavaScript позволяет выполнять код при обнаружении событий. </p> <p> HTML позволяет добавлять атрибуты обработчика событий, <strong> с кодом JavaScript </strong>, в элементы HTML.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/2.bp.blogspot.com/-8-XClvuwGIo/VKWZRlx6xmI/AAAAAAAAYB0/0objoTkd3hM/s1600/Slide4.PNG' style='float: right;' /><noscript><img src='/800/600/http/2.bp.blogspot.com/-8-XClvuwGIo/VKWZRlx6xmI/AAAAAAAAYB0/0objoTkd3hM/s1600/Slide4.PNG' style='float: right;' /></noscript> </p> <p> В одинарных кавычках: </p> <p> <<em> элемент </em> <em> событие </em> = <strong> ‘</strong> <em> <strong> некоторый JavaScript </strong> </em> <strong>‘ </strong>> </p> <p> В двойных кавычках: </p> <p> <<em> элемент </em> <em> событие </em> = <strong> «</strong> <em> <strong> некоторый JavaScript </strong> </em> <strong>» </strong>> </p> <p> В следующем примере атрибут <code> onclick </code> (с кодом) добавляется к <code> <button> </code> элемент: </p> <h4><span class="ez-toc-section" id="i-14"> Пример </span></h4> <p> <button> Время? </button> <br/> </p> Попробуй сам » <p> В приведенном выше примере код JavaScript изменяет содержимое элемент с.</p> <p> В следующем примере код изменяет содержимое собственный элемент (используя <code> <strong> этот </strong> .innerHTML </code>): </p> <h4><span class="ez-toc-section" id="i-15"> Пример </span></h4> <p> <button> Время? </button> <br/> </p> Попробуй сам » Код JavaScript <p> часто состоит из нескольких строк. Чаще всего можно увидеть функции вызова атрибутов событий: </p> <hr/> <hr/> <h3><span class="ez-toc-section" id="_HTML-3"> Общие события HTML </span></h3> <p> Вот список некоторых распространенных событий HTML: </p> <table> <tr> <th> Событие </th> <th> Описание </th> </tr> <tr> <td> на замену </td> <td> Изменен элемент HTML </td> </tr> <tr> <td> onclick </td> <td> Пользователь щелкает элемент HTML </td> </tr> <tr> <td> на мышке над </td> <td> Пользователь наводит указатель мыши на элемент HTML </td> </tr> <tr> <td> onmouseout </td> <td> Пользователь отводит указатель мыши от элемента HTML </td> </tr> <tr> <td> нажатие клавиши </td> <td> Пользователь нажимает клавишу на клавиатуре </td> </tr> <tr> <td> загрузка </td> <td> Браузер завершил загрузку страницы </td> </tr> </table> <p> Список намного длиннее: W3Schools Справочник по JavaScript События HTML DOM.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/i.stack.imgur.com/5OBLd.png' style='float: right;' /><noscript><img src='/800/600/https/i.stack.imgur.com/5OBLd.png' style='float: right;' /></noscript> </p> <hr/> <h3><span class="ez-toc-section" id="_JavaScript-4"> Что умеет JavaScript? </span></h3> <p> Обработчики событий могут использоваться для обработки и проверки пользовательского ввода, действий пользователя, и действия браузера: </p> <ul> <li> Что нужно делать каждый раз при загрузке страницы </li> <li> Что делать при закрытии страницы </li> <li> Действие, которое должно выполняться, когда пользователь нажимает кнопку </li> <li> Контент, который следует проверять при вводе данных пользователем </li> <li> И многое другое … </li> </ul> <p> Для работы JavaScript с событиями можно использовать множество различных методов: </p> <ul> <li> Атрибуты событий HTML могут выполнять код JavaScript напрямую </li> <li> Атрибуты событий HTML могут вызывать функции JavaScript </li> <li> Вы можете назначить свои собственные функции обработчика событий элементам HTML </li> <li> Вы можете запретить отправку или обработку событий </li> <li> И многое другое… </li> </ul> <p> Вы узнаете намного больше о событиях и обработчиках событий в главах HTML DOM.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/habr.com/share/publication/177059/72666cf85b23684ca2dd84ac55cea34f/?v=1' style='float: right;' /><noscript><img src='/800/600/https/habr.com/share/publication/177059/72666cf85b23684ca2dd84ac55cea34f/?v=1' style='float: right;' /></noscript> </p> <hr/> <hr/> <br/> <table> <h2><span class="ez-toc-section" id="_HTML_DOM-3"> Объект события HTML DOM </span></h2> <p> События HTML DOM позволяют JavaScript регистрировать различные обработчики событий на элементы в HTML-документе. </p> <p> События обычно используются в сочетании с функциями, и функция не будет выполняться до того, как произойдет событие (например, когда пользователь нажимает кнопку). </p> <tr> <th> Событие </th> <th> Описание </th> <th> принадлежит </th> </tr> <tr> <td> прервать </td> <td> Событие возникает, когда загрузка носителя прервана </td> <td> UiEvent, событие </td> </tr> <tr> <td> послепечатка </td> <td> Событие возникает, когда страница начала печать или если диалоговое окно печати было закрыто. </td> <td> Событие </td> </tr> <tr> <td> конец анимации </td> <td> Событие происходит, когда анимация CSS завершена. </td> <td> AnimationEvent </td> </tr> <tr> <td> анимация </td> <td> Событие происходит при повторении CSS-анимации </td> <td> AnimationEvent </td> </tr> <tr> <td> анимация старт </td> <td> Событие происходит при запуске CSS-анимации </td> <td> AnimationEvent </td> </tr> <tr> <td> до печати </td> <td> Событие происходит, когда страница собирается напечатать </td> <td> Событие </td> </tr> <tr> <td> перед выгрузкой </td> <td> Событие происходит перед выгрузкой документа </td> <td> UiEvent, Событие </td> </tr> <tr> <td> размытие </td> <td> Событие происходит, когда элемент теряет фокус </td> <td> FocusEvent </td> </tr> <tr> <td> канплей </td> <td> Событие возникает, когда браузер может начать воспроизведение мультимедиа (когда он буферизован хватит для начала) </td> <td> Событие </td> </tr> <tr> <td> может пройти через </td> <td> Событие возникает, когда браузер может воспроизводить мультимедиа без остановка для буферизации </td> <td> Событие </td> </tr> <tr> <td> изменить </td> <td> Событие возникает при изменении содержимого элемента формы, выбора или отмеченного состояния (для <input>, <select> и <textarea>) </td> <td> Событие </td> </tr> <tr> <td> нажмите </td> <td> Событие происходит, когда пользователь нажимает на элемент </td> <td> MouseEvent </td> </tr> <tr> <td> контекстное меню </td> <td> Событие возникает, когда пользователь щелкает правой кнопкой мыши элемент, чтобы открыть контекстное меню.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/wiki.compilgames.net/lib/exe/fetch.php/gdevelop5/events/platformerjavascriptblocksexample.png' style='float: right;' /><noscript><img src='/800/600/http/wiki.compilgames.net/lib/exe/fetch.php/gdevelop5/events/platformerjavascriptblocksexample.png' style='float: right;' /></noscript> </td> <td> MouseEvent </td> </tr> <tr> <td> копия </td> <td> Событие возникает, когда пользователь копирует содержимое элемента </td> <td> Буфер обмена Событие </td> </tr> <tr> <td> разрез </td> <td> Событие возникает, когда пользователь сокращает содержимое элемента </td> <td> Буфер обмена Событие </td> </tr> <tr> <td> dblclick </td> <td> Событие возникает, когда пользователь дважды щелкает элемент </td> <td> MouseEvent </td> </tr> <tr> <td> перетяжка </td> <td> Событие возникает при перетаскивании элемента </td> <td> DragEvent </td> </tr> <tr> <td> драгенд </td> <td> Событие возникает, когда пользователь закончил перетаскивать элемент </td> <td> DragEvent </td> </tr> <tr> <td> Драгентер </td> <td> Событие происходит, когда перетаскиваемый элемент попадает в цель перетаскивания </td> <td> DragEvent </td> </tr> <tr> <td> Драглев </td> <td> Событие возникает, когда перетаскиваемый элемент покидает цель перетаскивания </td> <td> DragEvent </td> </tr> <tr> <td> драговер </td> <td> Событие возникает, когда перетаскиваемый элемент находится над целью перетаскивания </td> <td> DragEvent </td> </tr> <tr> <td> драгстарт </td> <td> Событие возникает, когда пользователь начинает перетаскивать элемент </td> <td> DragEvent </td> </tr> <tr> <td> падение </td> <td> Событие происходит, когда перетаскиваемый элемент отбрасывается на цель перетаскивания </td> <td> DragEvent </td> </tr> <tr> <td> изменение длительности </td> <td> Событие возникает при изменении длительности носителя </td> <td> Событие </td> </tr> <tr> <td> окончание </td> <td> Событие происходит, когда носитель подошел к концу (полезно для сообщений типа «спасибо за прослушивание»).<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/progi.pro/media/main/00/db/dd/00dbdd25a1e20e28c55ded2c32aaa756.png' style='float: right;' /><noscript><img src='/800/600/https/progi.pro/media/main/00/db/dd/00dbdd25a1e20e28c55ded2c32aaa756.png' style='float: right;' /></noscript> </td> <td> Событие </td> </tr> <tr> <td> ошибка </td> <td> Событие возникает при возникновении ошибки при загрузке внешнего файла </td> <td> ProgressEvent, г. UiEvent, событие </td> </tr> <tr> <td> фокус </td> <td> Событие происходит, когда элемент получает фокус </td> <td> FocusEvent </td> </tr> <tr> <td> фокус в </td> <td> Событие происходит, когда элемент собирается получить фокус </td> <td> FocusEvent </td> </tr> <tr> <td> фокус </td> <td> Событие происходит, когда элемент собирается потерять фокус </td> <td> FocusEvent </td> </tr> <tr> <td> полноэкранный режим смены </td> <td> Событие возникает, когда элемент отображается в полноэкранном режиме </td> <td> Событие </td> </tr> <tr> <td> полноэкранная ошибка </td> <td> Событие возникает, когда элемент не может отображаться в полноэкранном режиме </td> <td> Событие </td> </tr> <tr> <td> хэш-обмен </td> <td> Событие возникает, когда были внесены изменения в часть привязки URL-адреса </td> <td> HashChangeEvent </td> </tr> <tr> <td> вход </td> <td> Событие происходит, когда элемент получает ввод пользователя </td> <td> InputEvent, Событие </td> </tr> <tr> <td> недействительный </td> <td> Событие возникает при недопустимом элементе </td> <td> Событие </td> </tr> <tr> <td> нажатие клавиши </td> <td> Событие возникает, когда пользователь нажимает клавишу </td> <td> KeyboardEvent </td> </tr> <tr> <td> нажатие клавиши </td> <td> Событие возникает при нажатии пользователем клавиши </td> <td> KeyboardEvent </td> </tr> <tr> <td> клавиатура </td> <td> Событие происходит, когда пользователь отпускает клавишу </td> <td> KeyboardEvent </td> </tr> <tr> <td> нагрузка </td> <td> Событие происходит при загрузке объекта </td> <td> UiEvent, Событие </td> </tr> <tr> <td> загруженные данные </td> <td> Событие происходит при загрузке медиа-данных </td> <td> Событие </td> </tr> <tr> <td> загруженные метаданные </td> <td> Событие возникает при загрузке метаданных (например, размеров и продолжительности) </td> <td> Событие </td> </tr> <tr> <td> загрузка </td> <td> Событие возникает, когда браузер начинает поиск указанного носителя.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/i.stack.imgur.com/c8qpx.gif' style='float: right;' /><noscript><img src='/800/600/https/i.stack.imgur.com/c8qpx.gif' style='float: right;' /></noscript> </td> <td> ProgressEvent </td> </tr> <tr> <td> сообщение </td> <td> Событие возникает, когда сообщение получено через источник события </td> <td> Событие </td> </tr> <tr> <td> mousedown </td> <td> Событие происходит, когда пользователь нажимает кнопку мыши над элементом </td> <td> MouseEvent </td> </tr> <tr> <td> mouseenter </td> <td> Событие возникает, когда указатель перемещается на элемент </td> <td> MouseEvent </td> </tr> <tr> <td> мышиный лист </td> <td> Событие возникает, когда указатель перемещается из элемента </td> <td> MouseEvent </td> </tr> <tr> <td> mousemove </td> <td> Событие происходит, когда указатель перемещается, когда он находится над элементом </td> <td> MouseEvent </td> </tr> <tr> <td> при наведении курсора мыши </td> <td> Событие происходит, когда указатель перемещается на элемент или на один из его дочерних элементов </td> <td> MouseEvent </td> </tr> <tr> <td> мышь </td> <td> Событие возникает, когда пользователь перемещает указатель мыши за пределы элемента или одного из его дочерних элементов </td> <td> MouseEvent </td> </tr> <tr> <td> мышь </td> <td> Событие происходит, когда пользователь отпускает кнопку мыши над элементом </td> <td> MouseEvent </td> </tr> <tr> <td> колесико мыши </td> <td> Не рекомендуется.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/www.pvsm.ru/images/2016/11/25/konsol-razrabotchika-Google-Chrome-desyat-neochevidnyh-poleznostei-3.png' style='float: right;' /><noscript><img src='/800/600/https/www.pvsm.ru/images/2016/11/25/konsol-razrabotchika-Google-Chrome-desyat-neochevidnyh-poleznostei-3.png' style='float: right;' /></noscript> Использовать событие колеса вместо </td> <td> WheelEvent </td> </tr> <tr> <td> не в сети </td> <td> Событие возникает при переходе браузера в автономный режим </td> <td> Событие </td> </tr> <tr> <td> онлайн </td> <td> Событие возникает, когда браузер начинает работать в сети </td> <td> Событие </td> </tr> <tr> <td> открытый </td> <td> Событие возникает при открытии соединения с источником события </td> <td> Событие </td> </tr> <tr> <td> скрыть страницу </td> <td> Событие происходит, когда пользователь уходит с веб-страницы </td> <td> PageTransitionEvent </td> </tr> <tr> <td> страниц показать </td> <td> Событие происходит, когда пользователь переходит на веб-страницу </td> <td> PageTransitionEvent </td> </tr> <tr> <td> паста </td> <td> Событие возникает, когда пользователь вставляет некоторый контент в элемент </td>. <td> Буфер обмена Событие </td> </tr> <tr> <td> пауза </td> <td> Событие возникает, когда воспроизведение мультимедиа приостановлено пользователем или программно </td> <td> Событие </td> </tr> <tr> <td> играть </td> <td> Событие возникает, когда носитель был запущен или больше не приостановлен </td> <td> Событие </td> </tr> <tr> <td> играет </td> <td> Событие возникает, когда медиа воспроизводится после приостановки или остановки для буферизации </td> <td> Событие </td> </tr> <tr> <td> popstate </td> <td> Событие происходит при изменении истории окна </td> <td> PopStateEvent </td> </tr> <tr> <td> прогресс </td> <td> Событие происходит, когда браузер находится в процессе получения медиафайлов.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/avatars.mds.yandex.net/get-zen_doc/237236/pub_5f4b5ea92e211011a8d1d079_5f4b60194ccdb914fb751037/scale_1200' style='float: right;' /><noscript><img src='/800/600/https/avatars.mds.yandex.net/get-zen_doc/237236/pub_5f4b5ea92e211011a8d1d079_5f4b60194ccdb914fb751037/scale_1200' style='float: right;' /></noscript> данные (загрузка носителя) </td> <td> Событие </td> </tr> <tr> <td> курс </td> <td> Событие происходит при изменении скорости воспроизведения носителя </td> <td> Событие </td> </tr> <tr> <td> изменить размер </td> <td> Событие происходит при изменении размера представления документа </td> <td> UiEvent, Событие </td> </tr> <tr> <td> сброс </td> <td> Событие происходит при сбросе формы </td> <td> Событие </td> </tr> <tr> <td> свиток </td> <td> Событие возникает при прокрутке полосы прокрутки элемента </td> <td> UiEvent, Событие </td> </tr> <tr> <td> поиск </td> <td> Событие возникает, когда пользователь что-то вводит в поле поиска (для <input = "search">) </td> <td> Событие </td> </tr> <tr> <td> разыскано </td> <td> Событие происходит, когда пользователь заканчивает движение / переход к новой позиции. в СМИ </td> <td> Событие </td> </tr> <tr> <td> ищу </td> <td> Событие происходит, когда пользователь начинает движение / переход к новой позиции в СМИ </td> <td> Событие </td> </tr> <tr> <td> выбрать </td> <td> Событие происходит после того, как пользователь выбрал некоторый текст (для <input> и <textarea>) </td> <td> UiEvent, Событие </td> </tr> <tr> <td> показать </td> <td> Событие происходит, когда элемент <menu> отображается как контекстное меню </td> <td> Событие </td> </tr> <tr> <td> остановлено </td> <td> Событие возникает, когда браузер пытается получить данные мультимедиа, но данные недоступны </td> <td> Событие </td> </tr> <tr> <td> склад </td> <td> Событие происходит при обновлении области веб-хранилища </td> <td> StorageEvent </td> </tr> <tr> <td> представить </td> <td> Событие происходит при отправке формы </td> <td> Событие </td> </tr> <tr> <td> приостановить </td> <td> Событие возникает, когда браузер намеренно не получает медиаданные </td> <td> Событие </td> </tr> <tr> <td> время обновления </td> <td> Событие происходит, когда позиция воспроизведения изменилась (например, когда пользователь перемотка вперед к другому месту в СМИ) </td> <td> Событие </td> </tr> <tr> <td> переключатель </td> <td> Событие происходит, когда пользователь открывает или закрывает элемент <details> </td> <td> Событие </td> </tr> <tr> <td> сенсорный отмена </td> <td> Событие происходит при прерывании касания </td> <td> TouchEvent </td> </tr> <tr> <td> Тушенд </td> <td> Событие происходит при удалении пальца с сенсорного экрана </td> <td> TouchEvent </td> </tr> <tr> <td> сенсорное перемещение </td> <td> Событие возникает при перетаскивании пальца по экрану </td> <td> TouchEvent </td> </tr> <tr> <td> сенсорный запуск </td> <td> Событие возникает, когда палец прикладывается к сенсорному экрану </td> <td> TouchEvent </td> </tr> <tr> <td> переходник </td> <td> Событие происходит, когда переход CSS завершен.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/pbs.twimg.com/media/DkPP_3CVAAAb99t.jpg' style='float: right;' /><noscript><img src='/800/600/https/pbs.twimg.com/media/DkPP_3CVAAAb99t.jpg' style='float: right;' /></noscript> </td> <td> TransitionEvent </td> </tr> <tr> <td> разгружать </td> <td> Событие возникает после выгрузки страницы (для <body>) </td> <td> UiEvent, Событие </td> </tr> <tr> <td> изменение объема </td> <td> Событие происходит при изменении громкости носителя (включая настройку громкость до «без звука») </td> <td> Событие </td> </tr> <tr> <td> ожидание </td> <td> Событие происходит, когда воспроизведение мультимедиа приостановлено, но ожидается, что оно возобновится (например, когда медиа останавливается для буферизации большего количества данных) </td> <td> Событие </td> </tr> <tr> <td> колесо </td> <td> Событие происходит, когда колесо мыши наматывается вверх или вниз над элементом </td> <td> WheelEvent </td> </tr> <tr> <th> Свойство / метод </th> <th colspan="2"> Описание </th> <th> принадлежит </th> </tr> <tr> <td> altKey </td> <td colspan="2"> Возвращает, была ли нажата клавиша «ALT» при срабатывании события мыши.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/i.stack.imgur.com/BZNcG.png' style='float: right;' /><noscript><img src='/800/600/https/i.stack.imgur.com/BZNcG.png' style='float: right;' /></noscript> </td> <td> MouseEvent </td> </tr> <tr> <td> altKey </td> <td colspan="2"> Возвращает, была ли нажата клавиша «ALT» при срабатывании ключевого события </td> <td> KeyboardEvent, TouchEvent </td> </tr> <tr> <td> animationName </td> <td colspan="2"> Возвращает имя анимации </td> <td> AnimationEvent </td> </tr> <tr> <td> пузырей </td> <td colspan="2"> Возвращает, является ли конкретное событие восходящим. </td> <td> Событие </td> </tr> <tr> <td> кнопка </td> <td colspan="2"> Возвращает, какая кнопка мыши была нажата при срабатывании события мыши </td> <td> MouseEvent </td> </tr> <tr> <td> кнопки </td> <td colspan="2"> Возвращает, какие кнопки мыши были нажаты при срабатывании события мыши </td> <td> MouseEvent </td> </tr> <tr> <td> с возможностью отмены </td> <td colspan="2"> Возвращает, можно ли предотвратить действие по умолчанию для события </td> <td> Событие </td> </tr> <tr> <td> charCode </td> <td colspan="2"> Возвращает код символа Unicode для клавиши, вызвавшей событие onkeypress </td> <td> KeyboardEvent </td> </tr> <tr> <td> изменить Касания </td> <td colspan="2"> Возвращает список всех сенсорных объектов, состояние которых изменилось между предыдущее касание и это касание </td> <td> TouchEvent </td> </tr> <tr> <td> клиент X </td> <td colspan="2"> Возвращает горизонтальную координату указателя мыши относительно текущего окна, когда событие мыши было инициировано </td> <td> MouseEvent, TouchEvent </td> </tr> <tr> <td> клиент </td> <td colspan="2"> Возвращает вертикальную координату указателя мыши относительно текущего окна, когда событие мыши было инициировано </td> <td> MouseEvent, TouchEvent </td> </tr> <tr> <td> буфер обмена Данные </td> <td colspan="2"> Возвращает объект, содержащий данные, затронутые буфером обмена.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/slideplayer.com/slide/17021671/98/images/11/The+JavaScript+for+the+FAQs+application.jpg' style='float: right;' /><noscript><img src='/800/600/https/slideplayer.com/slide/17021671/98/images/11/The+JavaScript+for+the+FAQs+application.jpg' style='float: right;' /></noscript> операция </td> <td> Буфер обмена Данные </td> </tr> <tr> <td> код </td> <td colspan="2"> Возвращает код ключа, вызвавшего событие </td> <td> KeyboardEvent </td> </tr> <tr> <td> в составе </td> <td colspan="2"> Возвращает, составлено событие или нет. </td> <td> Событие </td> </tr> <tr> <td> createEvent () </td> <td colspan="2"> Создает новое событие </td> <td> Событие </td> </tr> <tr> <td> ctrlKey </td> <td colspan="2"> Возвращает, была ли нажата клавиша «CTRL» при срабатывании события мыши. </td> <td> MouseEvent </td> </tr> <tr> <td> ctrlKey </td> <td colspan="2"> Возвращает, была ли нажата клавиша «CTRL» при срабатывании ключевого события. </td> <td> KeyboardEvent, TouchEvent </td> </tr> <tr> <td> текущая цель </td> <td colspan="2"> Возвращает элемент, слушатели событий которого инициировали событие </td> <td> Событие </td> </tr> <tr> <td> данные </td> <td colspan="2"> Возвращает вставленные символы </td> <td> InputEvent </td> </tr> <tr> <td> передача данных </td> <td colspan="2"> Возвращает объект, содержащий перетаскиваемые / отбрасываемые данные, или вставлено / удалено </td> <td> DragEvent, InputEvent </td> </tr> <tr> <td> по умолчанию Предотвращено </td> <td colspan="2"> Возвращает, был ли вызван метод preventDefault () для события </td>.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/images.slideplayer.com/27/9226305/slides/slide_5.jpg' style='float: right;' /><noscript><img src='/800/600/https/images.slideplayer.com/27/9226305/slides/slide_5.jpg' style='float: right;' /></noscript> <td> Событие </td> </tr> <tr> <td> deltaX </td> <td colspan="2"> Возвращает величину горизонтальной прокрутки колеса мыши (ось x) </td> <td> WheelEvent </td> </tr> <tr> <td> deltaY </td> <td colspan="2"> Возвращает величину вертикальной прокрутки колеса мыши (ось Y). </td> <td> WheelEvent </td> </tr> <tr> <td> deltaZ </td> <td colspan="2"> Возвращает величину прокрутки колеса мыши для оси Z </td> <td> WheelEvent </td> </tr> <tr> <td> дельта Режим </td> <td colspan="2"> Возвращает число, представляющее единицу измерения для значений дельты (пиксели, линии или страницы). </td> <td> WheelEvent </td> </tr> <tr> <td> деталь </td> <td colspan="2"> Возвращает число, указывающее, сколько раз была нажата мышь </td> <td> UiEvent </td> </tr> <tr> <td> прошедшее время </td> <td colspan="2"> Возвращает количество секунд, в течение которых выполнялась анимация. </td> <td> AnimationEvent </td> </tr> <tr> <td> прошедшее время </td> <td colspan="2"> Возвращает количество секунд, в течение которых выполнялся переход.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/images2017.cnblogs.com/blog/672567/201709/672567-20170904085413241-326702719.png' style='float: right;' /><noscript><img src='/800/600/https/images2017.cnblogs.com/blog/672567/201709/672567-20170904085413241-326702719.png' style='float: right;' /></noscript> </td> <td> </td> </tr> <tr> <td> этап события </td> <td colspan="2"> Возвращает, какая фаза потока событий в настоящее время оценивается </td> <td> Событие </td> </tr> <tr> <td> getTargetRanges () </td> <td colspan="2"> Возвращает массив, содержащий целевые диапазоны, на которые будет влиять вставка / удаление </td> <td> InputEvent </td> </tr> <tr> <td> getModifierState () </td> <td colspan="2"> Возвращает массив, содержащий целевые диапазоны, на которые будет влиять вставка / удаление </td> <td> MouseEvent </td> </tr> <tr> <td> input Тип </td> <td colspan="2"> Возвращает тип изменения (т.е.e «вставка» или «удаление») </td> <td> InputEvent </td> </tr> <tr> <td> составляет </td> <td colspan="2"> Возвращает, создается ли состояние события или нет. </td> <td> InputEvent, KeyboardEvent </td> </tr> <tr> <td> доверено </td> <td colspan="2"> Возвращает, является ли событие доверенным.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/texterra.ru/upload/img/24-05-2017/6.png' style='float: right;' /><noscript><img src='/800/600/https/texterra.ru/upload/img/24-05-2017/6.png' style='float: right;' /></noscript> </td> <td> Событие </td> </tr> <tr> <td> ключ </td> <td colspan="2"> Возвращает значение ключа для ключа, представленного событием </td>. <td> KeyboardEvent </td> </tr> <tr> <td> ключ </td> <td colspan="2"> Возвращает ключ измененного элемента хранилища </td> <td> StorageEvent </td> </tr> <tr> <td> ключ Код </td> <td colspan="2"> Возвращает код символа Unicode для клавиши, вызвавшей событие onkeypress, или Код клавиши Unicode для клавиши, вызвавшей нажатие клавиши или событие onkeyup </td> <td> KeyboardEvent </td> </tr> <tr> <td> местонахождение </td> <td colspan="2"> Возвращает расположение клавиши на клавиатуре или устройстве </td> <td> KeyboardEvent </td> </tr> <tr> <td> длина Вычисляемая </td> <td colspan="2"> Возвращает, можно ли вычислить длину прогресса. </td> <td> ProgressEvent </td> </tr> <tr> <td> загружено </td> <td colspan="2"> Возвращает количество загруженной работы </td> <td> ProgressEvent </td> </tr> <tr> <td> metaKey </td> <td colspan="2"> Возвращает, была ли нажата клавиша «META» при срабатывании события </td> <td> MouseEvent </td> </tr> <tr> <td> metaKey </td> <td colspan="2"> Возвращает, была ли нажата клавиша «мета» при срабатывании ключевого события.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/images.myshared.ru/4/193471/slide_11.jpg' style='float: right;' /><noscript><img src='/800/600/http/images.myshared.ru/4/193471/slide_11.jpg' style='float: right;' /></noscript> </td> <td> KeyboardEvent, TouchEvent </td> </tr> <tr> <td> Механизм X </td> <td colspan="2"> Возвращает горизонтальную координату указателя мыши относительно позиция последнего события mousemove </td> <td> MouseEvent </td> </tr> <tr> <td> ДвижениеY </td> <td colspan="2"> Возвращает вертикальную координату указателя мыши относительно позиция последнего события mousemove </td> <td> MouseEvent </td> </tr> <tr> <td> новый Значение </td> <td colspan="2"> Возвращает новое значение измененного элемента памяти </td> <td> StorageEvent </td> </tr> <tr> <td> новыйURL </td> <td colspan="2"> Возвращает URL-адрес документа после изменения хэша. </td> <td> HasChangeEvent </td> </tr> <tr> <td> смещение X </td> <td colspan="2"> Возвращает горизонтальную координату указателя мыши относительно положение края целевого элемента </td> <td> MouseEvent </td> </tr> <tr> <td> смещение Y </td> <td colspan="2"> Возвращает вертикальную координату указателя мыши относительно положение края целевого элемента </td> <td> MouseEvent </td> </tr> <tr> <td> старое значение </td> <td colspan="2"> Возвращает старое значение измененного элемента хранилища </td> <td> StorageEvent </td> </tr> <tr> <td> старыйURL </td> <td colspan="2"> Возвращает URL-адрес документа до изменения хэша.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/progi.pro/media/main/64/90/6d/64906d409c86d7e69a4f6c9dd071ff93.png' style='float: right;' /><noscript><img src='/800/600/https/progi.pro/media/main/64/90/6d/64906d409c86d7e69a4f6c9dd071ff93.png' style='float: right;' /></noscript> </td> <td> HasChangeEvent </td> </tr> <tr> <td> без мусора </td> <td colspan="2"> Событие возникает, когда происходит что-то плохое, и медиафайл внезапно недоступен (например, неожиданно отключается) </td> <td> </td> </tr> <tr> <td> стр X </td> <td colspan="2"> Возвращает горизонтальную координату указателя мыши относительно документа, когда событие мыши было инициировано </td> <td> MouseEvent </td> </tr> <tr> <td> стр. </td> <td colspan="2"> Возвращает вертикальную координату указателя мыши относительно документа, когда событие мыши было инициировано </td> <td> MouseEvent </td> </tr> <tr> <td> сохраняется </td> <td colspan="2"> Возвращает, была ли веб-страница кэширована браузером. </td> <td> PageTransitionEvent </td> </tr> <tr> <td> preventDefault () </td> <td colspan="2"> Отменяет событие, если оно может быть отменено, что означает, что действие по умолчанию, относящееся к событию, не произойдет. </td> <td> Событие </td> </tr> <tr> <td> объект недвижимости </td> <td colspan="2"> Возвращает имя свойства CSS, связанного с анимацией или переходом.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/i.stack.imgur.com/naL6K.png' style='float: right;' /><noscript><img src='/800/600/https/i.stack.imgur.com/naL6K.png' style='float: right;' /></noscript> </td> <td> AnimationEvent, TransitionEvent </td> </tr> <tr> <td> псевдоэлемент </td> <td colspan="2"> Возвращает имя псевдоэлемента анимации или перехода. </td> <td> AnimationEvent, TransitionEvent </td> </tr> <tr> <td> регион </td> <td colspan="2"/> <td> MouseEvent </td> </tr> <tr> <td> relatedTarget </td> <td colspan="2"> Возвращает элемент, связанный с элементом, который вызвал событие мыши </td> <td> MouseEvent </td> </tr> <tr> <td> relatedTarget </td> <td colspan="2"> Возвращает элемент, связанный с элементом, вызвавшим событие </td> <td> FocusEvent </td> </tr> <tr> <td> повтор </td> <td colspan="2"> Возвращает, удерживается ли клавиша повторно или нет </td> <td> KeyboardEvent </td> </tr> <tr> <td> экран X </td> <td colspan="2"> Возвращает горизонтальную координату указателя мыши относительно экрана при срабатывании события </td> <td> MouseEvent </td> </tr> <tr> <td> экранY </td> <td colspan="2"> Возвращает вертикальную координату указателя мыши относительно экрана при срабатывании события </td> <td> MouseEvent </td> </tr> <tr> <td> ShiftKey </td> <td colspan="2"> Возвращает, была ли нажата клавиша «SHIFT» при возникновении события.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/www.wptemplate.com/wp-content/uploads/2012/08/Wordpress-Events-Calendar-Plugin.jpg' style='float: right;' /><noscript><img src='/800/600/https/www.wptemplate.com/wp-content/uploads/2012/08/Wordpress-Events-Calendar-Plugin.jpg' style='float: right;' /></noscript> </td> <td> MouseEvent </td> </tr> <tr> <td> shiftKey </td> <td colspan="2"> Возвращает, была ли нажата клавиша «SHIFT» при срабатывании ключевого события. </td> <td> KeyboardEvent, TouchEvent </td> </tr> <tr> <td> состояние </td> <td colspan="2"> Возвращает объект, содержащий копию записей истории </td> <td> PopStateEvent </td> </tr> <tr> <td colspan="2"> stopImmediatePropagation () </td> <td> Предотвращает вызов других слушателей того же события </td> <td> Событие </td> </tr> <tr> <td> остановить распространение () </td> <td colspan="2"> Предотвращает дальнейшее распространение события во время потока событий </td> <td> Событие </td> </tr> <tr> <td> складская площадь </td> <td colspan="2"> Возвращает объект, представляющий затронутый объект хранилища </td> <td> StorageEvent </td> </tr> <tr> <td> цель </td> <td colspan="2"> Возвращает элемент, вызвавший событие </td> <td> Событие </td> </tr> <tr> <td> targetTouches </td> <td colspan="2"> Возвращает список всех сенсорных объектов, которые контактируют с поверхность и где событие touchstart произошло на том же целевом элементе, что и текущий целевой элемент </td> <td> TouchEvent </td> </tr> <tr> <td> отметка времени </td> <td colspan="2"> Возвращает время (в миллисекундах относительно эпохи), в которое было создано событие.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/images.myshared.ru/6/655623/slide_15.jpg' style='float: right;' /><noscript><img src='/800/600/http/images.myshared.ru/6/655623/slide_15.jpg' style='float: right;' /></noscript> </td> <td> Событие </td> </tr> <tr> <td> всего </td> <td colspan="2"> Возвращает общий объем работы, которая будет загружена </td> <td> ProgressEvent </td> </tr> <tr> <td> касаний </td> <td colspan="2"> Возвращает список всех сенсорных объектов, которые в данный момент находятся в контакте с поверхность </td> <td> TouchEvent </td> </tr> <tr> <td> переходник </td> <td colspan="2"> Событие происходит, когда переход CSS завершен. </td> <td> TransitionEvent </td> </tr> <tr> <td> тип </td> <td colspan="2"> Возвращает название события </td> <td> Событие </td> </tr> <tr> <td> url </td> <td colspan="2"> Возвращает URL-адрес документа измененного элемента. </td> <td> StorageEvent </td> </tr> <tr> <td> который </td> <td colspan="2"> Возвращает, какая кнопка мыши была нажата при срабатывании события мыши </td> <td> MouseEvent </td> </tr> <tr> <td> который </td> <td colspan="2"> Возвращает код символа Unicode для клавиши, вызвавшей событие onkeypress, или Код клавиши Unicode для клавиши, вызвавшей нажатие клавиши или событие onkeyup </td> <td> KeyboardEvent </td> </tr> <tr> <td> вид </td> <td colspan="2"> Возвращает ссылку на объект Window, в котором произошло событие </td> <td> UiEvent </td> </tr> </table> <table> <h2><span class="ez-toc-section" id="_JavaScript-5"> События в JavaScript </span></h2> <tr> <td> отмена </td> <td> onabort </td> <td/> <td> Происходит, когда пользователь прерывает загрузку элемента img или input: image.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/3.bp.blogspot.com/-mUNI1ij2vIE/VMy_rQ0hUcI/AAAAAAAAYxI/p9N6FGtlvlw/s1600/Slide4.PNG' style='float: right;' /><noscript><img src='/800/600/https/3.bp.blogspot.com/-mUNI1ij2vIE/VMy_rQ0hUcI/AAAAAAAAYxI/p9N6FGtlvlw/s1600/Slide4.PNG' style='float: right;' /></noscript> <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> активировать </td> <td> включить активировать </td> <td/> <td> Происходит, когда элемент становится активным. <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> послепечатка </td> <td> после печати </td> <td/> <td> Происходит, когда браузер построил содержимое текущего документа для печати или для предварительного просмотра.<p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> после обновления </td> <td/> <td> Происходит для объекта с привязкой к данным после обновления данных в объекте источника данных. <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> перед активацией </td> <td> до активации </td> <td/> <td> Происходит до того, как элемент становится активным.<p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Частично </p> </td> </tr> <tr/> <tr> <td> до копирования </td> <td> перед копией </td> <td/> <td> Происходит перед копированием выделения в буфер обмена и перед событием oncopy.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/sun9-22.userapi.com/c624030/u51142/video/l_14915909.jpg' style='float: right;' /><noscript><img src='/800/600/https/sun9-22.userapi.com/c624030/u51142/video/l_14915909.jpg' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> до распила </td> <td> впереди </td> <td/> <td> Происходит до того, как выделение будет вырезано из документа, и дает возможность включить пункт меню «Вырезать».<p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> перед деактивировать </td> <td> вкл прежде деактивировать </td> <td/> <td> Происходит на активном элементе до того, как он потеряет активное состояние. <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> onbeforeeditfocus </td> <td/> <td> Происходит до того, как элемент input: file, input: password, input: text или textarea или элемент в редактируемой области станет активированным пользовательским интерфейсом.<p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> паста </td> <td> onbeforepaste </td> <td/> <td> Происходит до того, как содержимое буфера обмена будет вставлено в документ, и дает возможность включить пункт меню «Вставить».<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/mmcrm.ru/wp-content/uploads/jquery/connect2.png' style='float: right;' /><noscript><img src='/800/600/http/mmcrm.ru/wp-content/uploads/jquery/connect2.png' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> до печати </td> <td> перед печатью </td> <td/> <td> Происходит, когда браузер начинает создавать содержимое текущего документа для печати или для предварительного просмотра.<p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> перед выгрузкой </td> <td> перед выгрузкой </td> <td/> <td> Происходит до того, как браузер выгружает документ и предоставляет возможность отобразить диалоговое окно подтверждения, в котором пользователь может подтвердить, хочет ли он остаться или покинуть текущую страницу. <p> <b> Пузырьки: </b> Нет <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> до обновления </td> <td/> <td> Происходит в объекте привязки к данным до обновления данных в объекте источника данных.<p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> размытие </td> <td> onblur </td> <td/> <td> Происходит, когда элемент теряет фокус.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/http/cis2.oc.ctc.edu/oc_apps/Westlund/CIS255-xbook/255_u04e/JS-pass-funct.png' style='float: right;' /><noscript><img src='/800/600/http/cis2.oc.ctc.edu/oc_apps/Westlund/CIS255-xbook/255_u04e/JS-pass-funct.png' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> отскок </td> <td> на дребезге </td> <td/> <td> Происходит, когда содержимое элемента выделения касается одной стороны ограничивающего прямоугольника элемента выделения.<p> <b> Пузырьки: </b> Нет <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> однократная замена </td> <td/> <td> Происходит в объекте источника данных при изменении данных в нем. <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> изменить </td> <td> на замену </td> <td/> <td> Происходит при изменении выделения, отмеченного состояния или содержимого элемента.В некоторых случаях это происходит только тогда, когда элемент теряет фокус. <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> CheckboxStateChange </td> <td> <b> — </b> </td> <td/> <td> Происходит при изменении состояния флажка.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/progi.pro/media/main/95/49/0f/95490fe8f41a229a2d4fe4510e634158.png' style='float: right;' /><noscript><img src='/800/600/https/progi.pro/media/main/95/49/0f/95490fe8f41a229a2d4fe4510e634158.png' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> нажмите </td> <td> onclick </td> <td/> <td> Происходит, когда пользователь щелкает элемент.<p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> контекстное меню </td> <td> контекстное меню </td> <td/> <td> Происходит при нажатии правой кнопки мыши на элементе и отображении контекстного меню. <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> oncontrolselect </td> <td/> <td> Происходит до выбора элемента управления в редактируемой области.<p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> копия </td> <td> копия </td> <td/> <td> Происходит перед копированием выделения в буфер обмена. <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> разрез </td> <td> нарезка </td> <td/> <td> Происходит до того, как выделение будет вырезано из документа и добавлено в буфер обмена.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/cf2.ppt-online.org/files2/slide/6/6zV8PGbXCsBmwSnLgchZWJYKUAyalejNHkQfdR/slide-4.jpg' style='float: right;' /><noscript><img src='/800/600/https/cf2.ppt-online.org/files2/slide/6/6zV8PGbXCsBmwSnLgchZWJYKUAyalejNHkQfdR/slide-4.jpg' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> данные доступны </td> <td/> <td> Происходит каждый раз, когда новый блок данных становится доступным из источника. <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> ondatasetchanged </td> <td/> <td> Происходит в объекте источника данных, когда становится доступным исходный или новый набор данных.<p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> ondatasetcomplete </td> <td/> <td> Происходит для объекта источника данных, когда все его данные становятся доступными. <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> dblclick </td> <td> ondblclick </td> <td/> <td> Происходит, когда пользователь дважды щелкает элемент.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/mypresentation.ru/documents_6/9184df75367fefb97d43e26771ca1f52/img24.jpg' style='float: right;' /><noscript><img src='/800/600/https/mypresentation.ru/documents_6/9184df75367fefb97d43e26771ca1f52/img24.jpg' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> деактивировать </td> <td> вкл. Деактивировать </td> <td/> <td> Происходит на активном элементе, когда он теряет активное состояние. <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> ДОМ Активировать </td> <td> <b> — </b> </td> <td/> <td> Происходит, когда элемент становится активным.<p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> DOMAttrModified </td> <td> <b> — </b> </td> <td/> <td> Срабатывает, когда атрибут добавляется, удаляется или когда значение атрибута изменяется скриптом. <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> DOMCharacterDataModified </td> <td> <b> — </b> </td> <td/> <td> Срабатывает, когда сценарий изменяет значение TextNode.<p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> DOMFocusIn </td> <td> <b> — </b> </td> <td/> <td> Происходит до того, как элемент получит фокус.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/pbs.twimg.com/media/DbLQwqAVAAA--k2.png:large' style='float: right;' /><noscript><img src='/800/600/https/pbs.twimg.com/media/DbLQwqAVAAA--k2.png:large' style='float: right;' /></noscript> <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> DOMFocusOut </td> <td> <b> — </b> </td> <td/> <td> Происходит до того, как элемент теряет фокус.<p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> DOMMouseScroll </td> <td> <b> — </b> </td> <td/> <td> Происходит при вращении колесика мыши. <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> DOMNodeInserted </td> <td> <b> — </b> </td> <td/> <td> Происходит на узле, когда он добавляется к элементу.<p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> DOMNodeInsertedIntoDocument </td> <td> <b> — </b> </td> <td/> <td> Возникает на узле, когда он вставлен в документ. <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> DOMNodeRemoved </td> <td> <b> — </b> </td> <td/> <td> Происходит на узле, когда он удаляется из родительского.<p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> DOMNodeRemovedFromDocument </td> <td> <b> — </b> </td> <td/> <td> Происходит на узле, когда он удаляется из документа.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/thepresentation.ru/img/thumbs/5724d3922c4ab5dfbdff3bd6c09dcb3a-800x.jpg' style='float: right;' /><noscript><img src='/800/600/https/thepresentation.ru/img/thumbs/5724d3922c4ab5dfbdff3bd6c09dcb3a-800x.jpg' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> DOMSubtreeModified </td> <td> <b> — </b> </td> <td/> <td> Срабатывает на узле, когда происходит изменение в принадлежащем ему поддереве.<p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> перетяжка </td> <td> ондраг </td> <td/> <td> Периодически возникает на исходном элементе во время операции перетаскивания. <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> драгдроп </td> <td> <b> — </b> </td> <td/> <td> Происходит на возможном целевом элементе, когда на него перетаскиваются перетаскиваемые данные.<p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> драгенд </td> <td> ондрагенд </td> <td/> <td> Происходит в исходном элементе, когда пользователь завершил операцию перетаскивания. <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> Драгентер </td> <td> ондрагентер </td> <td/> <td> Происходит в элементе, когда пользователь перемещает в него указатель мыши во время операции перетаскивания.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/qform24.com/assets/images/forma_zakaza/forma_zakaza7.jpg' style='float: right;' /><noscript><img src='/800/600/https/qform24.com/assets/images/forma_zakaza/forma_zakaza7.jpg' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> Драгексит </td> <td> <b> — </b> </td> <td/> <td> Происходит в элементе, когда пользователь перемещает указатель мыши из него во время операции перетаскивания. <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> перетаскивание </td> <td> <b> — </b> </td> <td/> <td> Происходит в исходном элементе, когда пользователь запускает операцию перетаскивания.<p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> Драглев </td> <td> ондраглейв </td> <td/> <td> Происходит в элементе, когда пользователь перемещает указатель мыши из него во время операции перетаскивания. <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> драговер </td> <td> ондраговер </td> <td/> <td> Периодически возникает на элементе, когда указатель мыши находится над ним во время операции перетаскивания.<p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> драгстарт </td> <td> ондрагстарт </td> <td/> <td> Происходит в исходном элементе, когда пользователь запускает операцию перетаскивания.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/www.bootstrapdash.com/wp-content/uploads/2017/12/bootstrap-3-datepicker-plugin.png' style='float: right;' /><noscript><img src='/800/600/https/www.bootstrapdash.com/wp-content/uploads/2017/12/bootstrap-3-datepicker-plugin.png' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> падение </td> <td> капля </td> <td/> <td> Происходит на возможном целевом элементе, когда на него перетаскиваются перетаскиваемые данные.<p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> ошибка </td> <td> ошибка </td> <td/> <td> Срабатывает, когда возникает ошибка при загрузке внешнего файла. <p> <b> Пузырьки: </b> Нет <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> ошибка (окно) </td> <td> onerror (окно) </td> <td/> <td> Срабатывает при возникновении ошибки сценария.<p> <b> Пузырьки: </b> Нет <b> Возможность отмены: </b> Да </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> onerrorupdate </td> <td/> <td> Происходит для объекта привязки к данным, когда он не может обновить данные в объекте источника данных. <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> на смену фильтров </td> <td/> <td> Происходит после изменения фильтра или завершения перехода.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/getscriptordietryin.files.wordpress.com/2018/02/2018-02-19-json-withoutprops.png?w=1326' style='float: right;' /><noscript><img src='/800/600/https/getscriptordietryin.files.wordpress.com/2018/02/2018-02-19-json-withoutprops.png?w=1326' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> отделка </td> <td> готово </td> <td/> <td> Происходит, когда элемент выделения завершает анимацию прокрутки. <p> <b> Пузырьки: </b> Нет <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> фокус </td> <td> onfocus </td> <td/> <td> Происходит, когда элемент получает фокус.<p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> фокус в </td> <td> onfocusin </td> <td/> <td> Происходит до того, как элемент получит фокус. <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> фокус </td> <td> onfocusout </td> <td/> <td> Происходит после того, как элемент теряет фокус.<p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> хэш-обмен </td> <td> onhashchange </td> <td/> <td> Происходит при изменении хеш-подраздела (начинается со знака «#») URL-адреса текущего документа.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/i.stack.imgur.com/iIJ6W.png' style='float: right;' /><noscript><img src='/800/600/https/i.stack.imgur.com/iIJ6W.png' style='float: right;' /></noscript> <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> справка </td> <td> onhelp </td> <td/> <td> Происходит после нажатия пользователем клавиши F1.<p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> вход </td> <td> на входе </td> <td/> <td> Происходит при изменении текстового содержимого элемента через пользовательский интерфейс. <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> нажатие клавиши </td> <td> onkeydown </td> <td/> <td> Происходит для элемента, находящегося в фокусе, при нажатии клавиши и периодически до тех пор, пока клавиша не будет отпущена.<p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> нажатие клавиши </td> <td> onkeypress </td> <td/> <td> Происходит для элемента, находящегося в фокусе, при нажатии клавиши и периодически до тех пор, пока клавиша не будет отпущена. <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> клавиатура </td> <td> onkeyup </td> <td/> <td> Происходит на элементе, находящемся в фокусе, когда пользователь отпускает клавишу.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/avatars.mds.yandex.net/get-zen_doc/1554513/pub_5cc5dff88e370c00b3670219_5cc5e3cc98348200b0ab7aa9/scale_1200' style='float: right;' /><noscript><img src='/800/600/https/avatars.mds.yandex.net/get-zen_doc/1554513/pub_5cc5dff88e370c00b3670219_5cc5e3cc98348200b0ab7aa9/scale_1200' style='float: right;' /></noscript> <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> нагрузка </td> <td> загрузка </td> <td/> <td> Происходит при загрузке объекта. <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> onlosecapture </td> <td/> <td> Происходит, когда объект теряет захват мыши.<p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> сообщение </td> <td> в сообщении </td> <td/> <td> Происходит, когда метод postMessage отправляет сообщение в текущее окно. <p> <b> Пузырьки: </b> Нет <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> mousedown </td> <td> onmousedown </td> <td/> <td> Происходит, когда пользователь нажимает кнопку мыши над элементом.<p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> mouseenter </td> <td> onmouseenter </td> <td/> <td> Происходит, когда пользователь перемещает указатель мыши в область элемента.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/i.imgur.com/Vb37LXu.png?1' style='float: right;' /><noscript><img src='/800/600/https/i.imgur.com/Vb37LXu.png?1' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> мышиный лист </td> <td> onmouseleave </td> <td/> <td> Происходит, когда пользователь перемещает указатель мыши за пределы элемента.<p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> mousemove </td> <td> onmousemove </td> <td/> <td> Происходит, когда пользователь наводит указатель мыши на элемент. <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> мышь </td> <td> onmouseout </td> <td/> <td> Происходит, когда пользователь перемещает указатель мыши за пределы элемента.<p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> при наведении курсора мыши </td> <td> на мышке над </td> <td/> <td> Происходит, когда пользователь перемещает указатель мыши в элемент. <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> мышь </td> <td> onmouseup </td> <td/> <td> Происходит, когда пользователь отпускает кнопку мыши над элементом.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/slideplayer.com/slide/6534295/23/images/25/User+Events+and+JavaScript+Event+Handlers.jpg' style='float: right;' /><noscript><img src='/800/600/https/slideplayer.com/slide/6534295/23/images/25/User+Events+and+JavaScript+Event+Handlers.jpg' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> колесико мыши </td> <td> колесо мыши </td> <td/> <td> Происходит при вращении колесика мыши. <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> onmove </td> <td/> <td> Происходит при изменении положения левого верхнего угла элемента.<p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> onmoveend </td> <td/> <td> Происходит, когда пользователь прекращает перетаскивать элемент с абсолютным или относительным позиционированием в редактируемой области. <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> onmovestart </td> <td/> <td> Происходит, когда пользователь начинает перетаскивать элемент с абсолютным или относительным позиционированием в редактируемой области.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/cdncontribute.geeksforgeeks.org/wp-content/uploads/Selection_003.bmp' style='float: right;' /><noscript><img src='/800/600/https/cdncontribute.geeksforgeeks.org/wp-content/uploads/Selection_003.bmp' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> не в сети </td> <td> в сети </td> <td/> <td> Происходит, когда браузер начинает работать в автономном режиме. <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> онлайн </td> <td> онлайн </td> <td/> <td> Происходит, когда браузер начинает работать в сети.<p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> перелив </td> <td> <b> — </b> </td> <td/> <td> Происходит, когда содержимое или размер элемента изменяется и вызывает появление полосы прокрутки. <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> переполнено </td> <td> <b> — </b> </td> <td/> <td> Происходит, когда содержимое или размер элемента изменяется и вызывает появление или исчезновение полосы прокрутки.<p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> паста </td> <td> паста </td> <td/> <td> Происходит до того, как содержимое буфера обмена будет вставлено в документ.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/pbs.twimg.com/media/D7vxNDaX4AARrcA.png' style='float: right;' /><noscript><img src='/800/600/https/pbs.twimg.com/media/D7vxNDaX4AARrcA.png' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> onpropertychange </td> <td/> <td> Происходит каждый раз при изменении значения свойства элемента.<p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> RadioStateChange </td> <td> <b> — </b> </td> <td/> <td> Происходит при изменении состояния переключателя. <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> готово к смене </td> <td> onreadystatechange </td> <td/> <td> Происходит при изменении состояния загрузки данных, принадлежащих элементу или документу HTML.<p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> готовый обмен (XML-документ) </td> <td> onreadystatechange (XML-документ) </td> <td/> <td> Происходит при изменении состояния загрузки объекта XMLDocument. <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> состояние готовности к изменению (XMLHttpRequest) </td> <td> onreadystatechange (XMLHttpRequest) </td> <td/> <td> Происходит при изменении состояния запроса.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/newcome.files.wordpress.com/2012/01/js-search.png' style='float: right;' /><noscript><img src='/800/600/https/newcome.files.wordpress.com/2012/01/js-search.png' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> сброс </td> <td> сброшено </td> <td/> <td> Происходит в форме до ее сброса. <p> <b> Пузырьки: </b> Нет <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> изменить размер </td> <td> размер </td> <td/> <td> Происходит при изменении размера объекта.<p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> onresizeend </td> <td/> <td> Происходит, когда пользователь прекращает изменять размер элемента в редактируемой области. <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> onresizestart </td> <td/> <td> Происходит, когда пользователь начинает изменять размер элемента в редактируемой области.<p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> onrowenter </td> <td/> <td> Происходит в объекте источника данных при изменении текущей строки в нем.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/hackernoon.com/hn-images/1eqSp3QIKqP-dKc4vNOwZHw.png' style='float: right;' /><noscript><img src='/800/600/https/hackernoon.com/hn-images/1eqSp3QIKqP-dKc4vNOwZHw.png' style='float: right;' /></noscript> <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> onrowexit </td> <td/> <td> Происходит в объекте источника данных до изменения текущей строки в нем.<p> <b> Пузырьки: </b> Нет <b> Возможность отмены: </b> Да </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> onrowdelete </td> <td/> <td> Происходит в объекте источника данных перед удалением строк. <p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> <b>—</b> </td> <td> вставлено </td> <td/> <td> Происходит в объекте источника данных после вставки строк.<p> <b> Пузырьки: </b> Да <b> Возможность отмены: </b> Нет </p> <p> <b> Объект события: </b> <b> — </b> </p> </td> </tr> <tr> <td> свиток </td> <td> в прокрутке </td> <td/> <td> Происходит при прокрутке содержимого элемента. <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> поиск </td> <td> в поиске </td> <td/> <td> Происходит, когда пользователь нажимает клавишу ENTER или щелкает кнопку «Стереть поисковый текст» (x) в поле ввода: поиска.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/mypresentation.ru/documents_6/818439234028cc3fa9cdaf660fec08ac/img15.jpg' style='float: right;' /><noscript><img src='/800/600/https/mypresentation.ru/documents_6/818439234028cc3fa9cdaf660fec08ac/img15.jpg' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> выбрать </td> <td> при выборе </td> <td/> <td> Происходит после выделения текста в элементе. <p> <b> Пузырьки: </b> Нет <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> выбор изменить </td> <td> на выбор, изменение </td> <td/> <td> Происходит при изменении выделения в документе.<p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> selectstart </td> <td> onselectstart </td> <td/> <td> Происходит в начале процесса выбора. <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> начало </td> <td> на старте </td> <td/> <td> Происходит, когда элемент marquee начинает анимацию прокрутки и когда начинается новый цикл.<p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> остановка </td> <td> остановка </td> <td/> <td> Происходит, когда пользователь прерывает загрузку документа.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/i.stack.imgur.com/5zmO5.png' style='float: right;' /><noscript><img src='/800/600/https/i.stack.imgur.com/5zmO5.png' style='float: right;' /></noscript> <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> представить </td> <td> onsubmit </td> <td/> <td> Происходит в элементе формы, когда пользователь нажимает кнопку отправки в форме.<p> <b> Пузырьки: </b> Нет <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> ввод текста </td> <td> <b> — </b> </td> <td/> <td> Происходит, когда в элемент вводятся некоторые символы. <p> <b> Пузыри: </b> Да <b> Возможность отмены: </b> Да </p> </td> </tr> <tr> <td> нижний предел </td> <td> <b> — </b> </td> <td/> <td> Происходит, когда содержимое или размер элемента изменяется и вызывает исчезновение полосы прокрутки.<p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> <tr> <td> разгружать </td> <td> под нагрузкой </td> <td/> <td> Происходит до того, как браузер выгружает документ. <p> <b> Пузыри: </b> Нет <b> Возможность отмены: </b> Нет </p> </td> </tr> </table> <h2><span class="ez-toc-section" id="i-16"> перечислить КАЖДОЕ событие, которое существует в браузере </span></h2> <h4><span class="ez-toc-section" id="_JavaScript-6"> События в JavaScript </span></h4> <blockquote> <p> <strong> tl; dr — Получите полную карту каждого события в браузере с помощью этого пакета npm.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/telegramfor.me/ext_img/forwebdev/3214' style='float: right;' /><noscript><img src='/800/600/https/telegramfor.me/ext_img/forwebdev/3214' style='float: right;' /></noscript> Посмотрите на результат запуска этого пакета в большом наборе браузеров и операционных систем в графическом представлении. </strong> </p> </blockquote> <p> События отличные. </p> <p> Мы, как разработчики JavaScript, постоянно используем их при создании и улучшении веб-сайтов и веб-приложений. Они являются неотъемлемой частью JavaScript и необходимы разработчику, желающему создать плавный и успешный UX любого типа. И все же, когда дело доходит до событий в JavaScript, мы многого не знаем.</p> <p> В основном, это разнообразие — существует так много разных событий, которые могут быть прослушаны JavaScript, а мы, как разработчики, почти не осознаем их. </p> <p> Это знание заставило меня задуматься: «Почему для этого нет карты?» Вы знаете, как карта каждого события каждого объекта в JavaScript, которое можно прослушать. Такая карта определенно поможет мне немного лучше понять мир событий JavaScript и, вероятно, узнать о многих событиях, с которыми я даже не знаком! </p> <p> Итак, эта мысль привела меня к вопросу «Как я могу получить эту информацию?» Сначала я попытался найти его в Интернете.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/avatars.mds.yandex.net/get-zen-pub-og/3062678/pub_5ee52e347cadb75a66e4ac95_5ee52e816b8fef25238216e1/orig' style='float: right;' /><noscript><img src='/800/600/https/avatars.mds.yandex.net/get-zen-pub-og/3062678/pub_5ee52e347cadb75a66e4ac95_5ee52e816b8fef25238216e1/orig' style='float: right;' /></noscript> Мне не удалось найти такую карту — полную карту, в которой перечислены все объекты и все события, которые можно прослушивать под этими объектами (пожалуйста, поделитесь, если вы знаете такую карту!). </p> <p> Итак, что вы делаете, когда обнаруживаете, что есть какие-то знания, которых не хватает в Интернете? Вы помогите им! </p> <p> Я понял, что создание такой карты не должно быть слишком сложным, если вы понимаете, как работает подписка на события в JavaScript. Два основных метода подписки на события в JavaScript — это прослушиватели событий и обработчики событий.Давайте кратко рассмотрим эти два метода: </p> <h4><span class="ez-toc-section" id="i-17"> Слушатели событий против. Обработчики событий </span></h4> <ol> <li> <code> прослушиватели событий </code>: прослушиватели событий могут быть прикреплены к объектам и прослушивать их события. Это так просто. К событию можно прикрепить неограниченное количество слушателей: </li> </ol><pre> <code> window.addEventListener ("клик", событие => { console.log (`первый слушатель:`, событие); }); window.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/i.ytimg.com/vi/B6kZbd_AO8U/maxresdefault.jpg' style='float: right;' /><noscript><img src='/800/600/https/i.ytimg.com/vi/B6kZbd_AO8U/maxresdefault.jpg' style='float: right;' /></noscript> addEventListener ("клик", event => { консоль.журнал (`второй слушатель:`, событие); }); window.addEventListener ("клик", event => { console.log (`третий слушатель:`, событие); }); </code> </pre><p> Использование прослушивателей событий является мощным средством не только потому, что может быть зарегистрировано более одного, но и потому, что может быть предоставлена дополнительная конфигурация действия подписки на событие. К сожалению, этот пост не об этом, и я не буду описывать эту часть прослушивателей событий, но это определенно то, что каждый разработчик JavaScript должен знать в совершенстве (я рекомендую вам прочитать об этом здесь).</p> <ol start="2"> <li> <code> обработчики событий </code>: их можно использовать для регистрации тех же событий, что и прослушиватели событий, но другим и менее мощным способом. Обработчики событий — это фактические свойства прототипа объекта. Одновременно может быть только один обработчик событий для объекта и его события, и настройка обработчика событий, в отличие от прослушивателей событий, не является вариантом.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/cf2.ppt-online.org/files2/slide/d/DNFnoZOuqmBJAjir2yS69PvEKe17bpW3LsQMXxHlTd/slide-10.jpg' style='float: right;' /><noscript><img src='/800/600/https/cf2.ppt-online.org/files2/slide/d/DNFnoZOuqmBJAjir2yS69PvEKe17bpW3LsQMXxHlTd/slide-10.jpg' style='float: right;' /></noscript> Его настройка по умолчанию всегда будет аналогична эффекту вызова <code> addEventListener </code> с <code> false </code> в качестве третьего аргумента: </li> </ol><pre> <code> документ.addEventListener ( "НЕКОТОРЫЕ_СОБЫТИЕ", event => { console.log ("НЕКОТОРЫЙ_СЧЕТЧИК"); }, ложный ); </code> </pre><p> Когда дело доходит до объектов, которые не являются узлами DOM, есть один способ установить обработчик событий: </p><pre> <code> window.onclick = event => { console.log («Этот обработчик НИКОГДА не будет вызван, так как он будет перезаписан»); }; window.onclick = event => { console.log («Этот обработчик - ЕДИНСТВЕННЫЙ обработчик, который будет выполняться при щелчке по окну», событие); }; </code> </pre><p> Однако, когда дело доходит до объектов, которые являются узлами DOM, установка обработчика событий также может быть достигнута с помощью API атрибутов более высокого уровня: </p><pre> <code> документ.body.setAttribute ("onclick", 'console.log ("нажата кнопка мыши", событие)'); document.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/i2.wp.com/forum.sublimetext.com/uploads/default/original/3X/0/8/0883cbfb1860285e8050babae477cc623d2c1173.png' style='float: right;' /><noscript><img src='/800/600/https/i2.wp.com/forum.sublimetext.com/uploads/default/original/3X/0/8/0883cbfb1860285e8050babae477cc623d2c1173.png' style='float: right;' /></noscript> body.onclick = event => { console.log («нажали тело», событие); }; </code> </pre><p> Помните, тот факт, что существует два способа зарегистрировать обработчик событий для объекта, не означает, что может быть более одного обработчика! API атрибутов просто лежит поверх API обработчика событий нижнего уровня: </p><pre> <code> document.body.setAttribute ("onclick", 'console.log ("нажата кнопка мыши:", событие)'); консоль.журнал (document.body.onclick); </code> </pre><p> В конце концов, оба обработчика событий <code> </code> и прослушиватели событий <code> </code> регистрируют предоставленные обратные вызовы в один и тот же пул слушателей — между ними нет разницы, когда событие запускается! </p> <h4><span class="ez-toc-section" id="i-18"> Как эти знания могут помочь с перечислением «КАЖДОГО события, которое существует в браузере»? </span></h4> <p> <strong> Этап 1. Извлечение всех поддерживаемых событий прототипа объекта </strong> </p> <p> Здесь все довольно просто. Если обработчики событий являются свойствами объектов, то эти объекты должны содержать ссылку на эти обработчики в своих прототипах.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/i.ytimg.com/vi/pKOCCUn9Grk/maxresdefault.jpg' style='float: right;' /><noscript><img src='/800/600/https/i.ytimg.com/vi/pKOCCUn9Grk/maxresdefault.jpg' style='float: right;' /></noscript> Например, поскольку <code> document.body </code> поддерживает событие <code> click </code>, <code> HTMLBodyElement </code> должен иметь свойство <code> onclick </code> (независимо от того, является ли это его собственным свойством или нет). Лучший способ получить все эти обработчики — перебрать прототип и найти их. Такие методы, как <code> Object.keys () </code> или <code> Object.getOwnPropertyNames () </code>, не помогут, если наша цель — получить ВСЕ свойства объекта, а не только его собственные свойства. Теперь то, что вам нужно искать в итерации, — это свойства, которые начинаются с <code> на </code>.Эти свойства по определению ссылаются на обработчики событий. Это должно выглядеть примерно так: </p><pre> <code> function _isEvent (prop) { if (0! == prop.indexOf ("on")) { вернуть ложь; } вернуть истину; } function _getEvents (obj) { var result = []; for (var prop in obj) { if (_isEvent (prop)) { prop = prop.substr (2); result.push (опора); } } вернуть результат; } console.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/demiart.ru/forum/uploads/post-9053-1203200706.jpg' style='float: right;' /><noscript><img src='/800/600/https/demiart.ru/forum/uploads/post-9053-1203200706.jpg' style='float: right;' /></noscript> log (_getEvents (XMLHttpRequest.prototype)); </code> </pre><p> Круто! Теперь у нас есть две простые функции, которым мы можем предоставить прототип объекта и получить все поддерживаемые им события.</p> <p> <strong> Этап 2. Извлечение всех поддерживаемых событий всех прототипов объектов в браузере </strong> </p> <p> Теперь все, что осталось сделать, — это динамически извлечь поддерживаемые события всех объектов, которые существуют в браузере (все, что находится под окном <code> </code>), используя вспомогательные функции, которые мы только что реализовали выше. Это означает, что сначала нам нужно запустить <code> _getEvents </code> в самом окне <code> </code>, чтобы получить все поддерживаемые им события. Затем нам нужно будет перебрать все собственные свойства окна <code> </code> и получить все события, поддерживаемые этими свойствами (например,грамм. <code> XMLHttpRequest </code> является свойством окна <code> </code>, поэтому нам также необходимо получить поддерживаемые им события).<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/www.dotnetodyssey.com/wp-content/uploads/2015/01/Ajax-Syntax.jpg' style='float: right;' /><noscript><img src='/800/600/https/www.dotnetodyssey.com/wp-content/uploads/2015/01/Ajax-Syntax.jpg' style='float: right;' /></noscript> </p><pre> <code> function getEvents () { const result = {}; результат ["окно"] = _getEvents (окно, hasOwnProperty); const arr = Object.getOwnPropertyNames (окно); for (let i = 0; i <arr.length; i ++) { константный элемент = arr [я]; пусть resultArray = []; пытаться { const obj = окно [элемент]; if (! obj \|\|! obj ["прототип"]) { Продолжить; } proto = obj ["прототип"]; resultArray = _getEvents (прото); } catch (err) { } результат [элемент] = resultArray; } вернуть результат; } </code> </pre><p> Вот и все! Теперь вызов <code> getEvents () </code> даст нам все события в браузере! И поскольку мы говорим о ОЧЕНЬ МНОГО событий, я не буду здесь документировать их все, но вы можете сами увидеть результат прямо здесь: jsfiddle / github gist.</p> <h4><span class="ez-toc-section" id="i-19"> А как насчет КАЖДОГО события, которое существует в КАЖДОМ браузере? </span></h4> <p> Здесь становится еще интереснее. Теперь, когда у нас есть возможность составить список всех событий в браузере, почему бы не создать инструмент, который извлекает эту информацию из каждого браузера во всех операционных системах и создает полную карту из извлеченных данных? </p> <p> Используя отличный продукт browserstack, я смог запустить функцию <code> getEvents () </code> на очень большом количестве браузеров и операционных систем, извлечь эти данные и представить их в графическом виде.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/i.stack.imgur.com/cJQKz.png' style='float: right;' /><noscript><img src='/800/600/https/i.stack.imgur.com/cJQKz.png' style='float: right;' /></noscript> Это представление можно найти прямо здесь, а весь список событий можно найти здесь. В последний раз я запускал код извлечения, когда Chrome 75 был последней версией, поэтому этот список может быть не полностью актуальным. Кроме того, этот список никоим образом не является исчерпывающим (например, в нем отсутствуют мобильные устройства), и я оставляю вам право прислать нам дополнительные устройства и браузеры, с которыми вы столкнетесь. Приглашаем вас помочь поддерживать этот список в актуальном состоянии! </p> <p> </p> <p> Проект можно найти на github, а также использовать как пакет npm.</p> <p> Надеюсь, эта статья и карта помогут пролить свет на разнообразие событий в JavaScript и помогут нам немного лучше понять и изучить их. </p> <blockquote> <p> Это исследование было проведено и опубликовано Галом Вейцманом от имени PerimeterX Inc. </p> </blockquote> <h2><span class="ez-toc-section" id="oop_-_javascript"> oop - Как добавить прослушиватель событий для всех событий в javascript, не перечисляя их по отдельности? </span></h2> <p> Я не на 100%, если это то, что вы ищете, но я думаю, что это то, что вы ищете.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/avatars.mds.yandex.net/get-zen_doc/3614701/pub_5ef117379360fb2031890cd7_5ef1177c4cb86116b342e3a7/scale_1200' style='float: right;' /><noscript><img src='/800/600/https/avatars.mds.yandex.net/get-zen_doc/3614701/pub_5ef117379360fb2031890cd7_5ef1177c4cb86116b342e3a7/scale_1200' style='float: right;' /></noscript> </p> <p> документ <code> </code>, который мы обычно добавляем для наших событий, не содержит событий. На самом деле это класс бабушек и дедушек. </p><pre> <code> документ -> HTMLDocument -> Document (где вы можете найти события onclick ) </code> </pre><p>, как вы могли видеть, мы можем это сделать. просто обрежьте <em> на </em> в начале событий </p><pre> <code> Object.keys (document .__ proto __.__ proto __). Reduce ((arr, event) => { если (event.startsWith ('on')) return [...arr, event.substr (2)]; возврат обр; }, []) </code> </pre><p>, который вернет что-то вроде: </p><pre> <code> [«readystatechange», «pointerlockchange», «pointerlockerror», «beforecopy», «beforecut», «beforepaste», «freeze», «возобновить», «search», «securitypolicyviolation», «visibilitychange», «copy» , «вырезать», «вставить», «прервать», «размыть», «отменить», «canplay», «canplaythrough», «изменить», «щелкнуть», «закрыть», «contextmenu», «cuechange», « dblclick »,« drag »,« dragend »,« dragenter »,« dragleave »,« dragover »,« dragstart »,« drop »,« durationchange »,« emptied »,« окончено »,« error »,« focus » , "formdata", "input", "invalid", "keydown", "keypress", "keyup", "load", "loadeddata", "loadedmetadata", "loadstart", "mousedown", "mouseenter", " mouseleave "," mousemove "," mouseout "," mouseover "," mouseup "," mousewheel "," pause "," play "," play "," progress "," ratechange "," reset "," resize " , "прокрутка", "поиск", "поиск", "выбор", "остановка", "отправка", "приостановка", "обновление по времени", "переключение", "изменение объема", "ожидание", "webkitanimationend", " webkitanimationiteration »,« webkitanimationstart »,« webkittransitionend »,« колесо », «auxclick», «gotpointercapture», «lostpointercapture», «pointerdown», «pointermove», «pointerup», «pointercancel», «pointerover», «pointerout», «pointerenter», «pointerleave», «selectstart», «selectionchange» "," animationend "," animationiteration "," animationstart "," transitionend "," fullscreenchange "," fullscreenerror "," webkitfullscreenchange "," webkitfullscreenerror "," pointerrawupdate "] </code> </pre><p> это просто кое-что, что я придумал, и я уверен, что есть лучшие ответы от более умных людей.<img class="lazy lazy-hidden" src="//ylianova.ru/wp-content/plugins/a3-lazy-load/assets/images/lazy_placeholder.gif" data-lazy-type="image" data-src='/800/600/https/1.bp.blogspot.com/-oTf0isCqP44/VKxPHJ2iBfI/AAAAAAAAYIo/5fcoaLssoA8/s1600/Slide4.PNG' style='float: right;' /><noscript><img src='/800/600/https/1.bp.blogspot.com/-oTf0isCqP44/VKxPHJ2iBfI/AAAAAAAAYIo/5fcoaLssoA8/s1600/Slide4.PNG' style='float: right;' /></noscript><div class='yarpp-related yarpp-related-none'> <p>No related posts.</p> </div> </div> </div> <div class="post-sharrre group"> <div id="twitter" data-url="https://ylianova.ru/javascript/sobytiya-v-javascript-spisok-spravochnik-po-sobytiyam-mdn.html" data-text="События в javascript список: Справочник по событиям \| MDN" data-title="Tweet"></div> <div id="facebook" data-url="https://ylianova.ru/javascript/sobytiya-v-javascript-spisok-spravochnik-po-sobytiyam-mdn.html" data-text="События в javascript список: Справочник по событиям \| MDN" data-title="Like"></div> <div id="googleplus" data-url="https://ylianova.ru/javascript/sobytiya-v-javascript-spisok-spravochnik-po-sobytiyam-mdn.html" data-text="События в javascript список: Справочник по событиям \| MDN" data-title="+1"></div> <div id="pinterest" data-url="https://ylianova.ru/javascript/sobytiya-v-javascript-spisok-spravochnik-po-sobytiyam-mdn.html" data-text="События в javascript список: Справочник по событиям \| MDN" data-title="Pin It"></div> </div> </div> </article> <ul class="post-nav group"> <li class="next"><a href="https://ylianova.ru/raznoe-2/embers-embers-speakeasy-menyu-embers-speakeasy.html" rel="next"><i class="fa fa-chevron-right"></i><strong>Вперед</strong> <span>Эмберс: EMBERS Speakeasy \| Меню — EMBERS Speakeasy</span></a></li> <li class="previous"><a href="https://ylianova.ru/sajt-2/gde-luchshe-sozdavat-sajt-top-12-konstruktorov-sajtov-rejting-2021-goda-seo-b-na-vc-ru.html" rel="prev"><i class="fa fa-chevron-left"></i><strong>Назад</strong> <span>Где лучше создавать сайт: Топ 12 конструкторов сайтов — рейтинг 2021 года — Seo B на vc.ru</span></a></li> </ul> <section id="comments" class="themeform"> <div id="respond" class="comment-respond"> <h3 id="reply-title" class="comment-reply-title">Добавить комментарий <small><a rel="nofollow" id="cancel-comment-reply-link" href="/javascript/sobytiya-v-javascript-spisok-spravochnik-po-sobytiyam-mdn.html#respond" style="display:none;">Отменить ответ</a></small></h3><form action="https://ylianova.ru/wp-comments-post.php" method="post" id="commentform" class="comment-form"><p class="comment-notes"><span id="email-notes">Ваш адрес email не будет опубликован.</span> <span class="required-field-message">Обязательные поля помечены <span class="required"></span></span></p><p class="comment-form-comment"><label for="comment">Комментарий <span class="required"></span></label> <textarea id="comment" name="comment" cols="45" rows="8" maxlength="65525" required="required"> `Имя ` `Email *` `Сайт` `Рубрики Рубрики Css Html Http Javascript Linux Photoshop Адаптив Верстка Вопросы и ответы Макет Развитие сайтов Разное Сайт Советы Шаблон Шаблоны Шрифт Шрифты` `Блог сумасшедшего сисадмина © 2025. Все права защищены. Карта сайта`

События в javascript список: Справочник по событиям | MDN

Справочник по событиям | MDN

Обзор событий и обработчиков — Руководства Web-разработчика

Список родных событий Javascript

События мыши

События клавиатуры

События элементов форм

События окна браузера

Все обработчики событий JavaScript — полный список с описанием

События в Javascript

Часто используемые HTML события

Что может делать JavaScript с событиями?

JS JavaScript HTML DOM События

Реагирование на события

Пример

Пример

Атрибуты события HTML

Пример

Назначение событий с помощью HTML DOM

Пример

События OnLoad и Unload

Пример

Событие onChange

Пример

События наведении курсора мыши

События OnMouseDown, OnMouseUp и OnClick

Ссылка на объект события HTML DOM

JavaScript — Виды событий — ИТ Шеф

Ссылка на событие | MDN

Рубрики

Рубрики