diff --git a/2-ui/4-forms-controls/3-events-change-input/article.md b/2-ui/4-forms-controls/3-events-change-input/article.md index 8e751022..e0d36c0b 100644 --- a/2-ui/4-forms-controls/3-events-change-input/article.md +++ b/2-ui/4-forms-controls/3-events-change-input/article.md @@ -4,7 +4,7 @@ Let's cover various events that accompany data updates. ## Event: change -The [change](http://www.w3.org/TR/html5/forms.html#event-input-change) event triggers when the element has finished changing. +The `change` event triggers when the element has finished changing. For text inputs that means that the event occurs when it loses focus. @@ -15,11 +15,21 @@ For instance, while we are typing in the text field below -- there's no event. B ``` -For other elements: `select`, `input type=checkbox/radio` it triggers right after the selection changes. +For other elements: `select`, `input type=checkbox/radio` it triggers right after the selection changes: + +```html autorun height=40 run + +``` + ## Event: input -The `input` event triggers every time a value is modified. +The `input` event triggers every time after a value is modified. Unlike keyboard events, it triggers on any value change, even those that does not involve keyboard actions: pasting with a mouse or using speech recognition to dictate the text. @@ -50,7 +60,7 @@ These events occur on cutting/copying/pasting a value. They belong to [ClipboardEvent](https://www.w3.org/TR/clipboard-apis/#clipboard-event-interfaces) class and provide access to the data that is copied/pasted. -We also can use `event.preventDefault()` to abort the action. +We also can use `event.preventDefault()` to abort the action, then nothing gets copied/pasted. For instance, the code below prevents all such events and shows what we are trying to cut/copy/paste: @@ -64,11 +74,13 @@ For instance, the code below prevents all such events and shows what we are tryi ``` -Technically, we can copy/paste everything. For instance, we can copy a file in the OS file manager, and paste it. +Please note, that it's possible to copy/paste not just text, but everything. For instance, we can copy a file in the OS file manager, and paste it. -There's a list of methods [in the specification](https://www.w3.org/TR/clipboard-apis/#dfn-datatransfer) to work with different data types, read/write to the clipboard. +There's a list of methods [in the specification](https://www.w3.org/TR/clipboard-apis/#dfn-datatransfer) that can work with different data types including files, read/write to the clipboard. -But please note that clipboard is a "global" OS-level thing. Most browsers allow read/write access to the clipboard only in the scope of certain user actions for the safety. Also it is forbidden to create "custom" clipboard events in all browsers except Firefox. +But please note that clipboard is a "global" OS-level thing. Most browsers allow read/write access to the clipboard only in the scope of certain user actions for the safety. + +Also it's forbidden to generate "custom" clipboard events with `dispatchEvent` in all browsers except Firefox. ## Summary