change

The change event triggers when the element has finished changing. For text inputs that means that the event occurs when it looses focus. For instance, while we are typing in the text field below – there’s no event. But when we move the focus somewhere else, for instance, click on a button – there will be a change event:

<input type="text" onchange="alert(this.value)">
<input type="button" value="Button">

For textbox and textarea, the event also occurs when you press Enter after typing.

For other elements: select, input type=checkbox/radio it triggers right after the selection changes.

input

The input event triggers every time a value is modified.

<input type="text" id="input"> <br> 
Result = <span id="result"></span>
<script>
  input.oninput = function() {
    result.innerHTML = input.value;
  };
</script>

Unlike keyboard events it works on any value change, even those that does not involve keyboard actions: pasting with a mouse or using speech recognition to dictate the text.

You cannot prevent anything using event.preventDefault() or return false;, because the event occurs after the values changes.

cut, copy, paste

These events occur on cutting/copying/pasting a value. They belong to ClipboardEvent class and provide access to the data that is copied/pasted. We also can use event.preventDefault() to abort the action.

For instance, the code below prevents all such events and shows what we are trying to cut/copy/paste:

<input type="text" id="input">
<script>
  input.oncut = input.oncopy = input.onpaste = function(event) {
    alert(event.type + ' - ' + event.clipboardData.getData('text/plain'));
    return false;
  };
</script>

Technically, we can copy/paste everything. For instance, we can copy and file in the OS file manager, and paste it.

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.

Example with cut/copy/paste does not shows what we are trying to cut/copy, because event (cut/copy) occurs before data were placed into clipboard by browser default action.