React identifies every events so that it must have common and consistent behavior ACROSS all the browsers. Normally, in normal JavaScript or other frameworks, the onchange event is triggered after we have typed something into a Textfield and then “exited out of it”. In ReactJS we cannot do it in this way.

The explanation is typical and non-trivial:

*”<input type=”text” value=”dataValue”> renders an input textbox initialized with the value, “dataValue”.

When the user changes the input in text field, the node’s value property will update and CHANGE. However, node.getAttribute(‘value’) will still return the value used at initialization time that is dataValue.

FORM Events:

• onChange: onChange event watches input changes and update state accordingly.
• onInput: It is triggered on input data
• onSubmit: It is triggered on submit button.

Mouse Events:

• onClick: OnClick of any components event is triggered on.
• onDoubleClick: onDoubleClick of any components event is triggered on.
• onMouseMove: onMouseMove of any components, panel event is triggered on.
• onMouseOver: onMouseOver of any components, panel, divs event is triggered on.

Touch Events:

• onTouchCancel: This event is for canceling an events.
• onTouchEnd: Time Duration attached to touch of a screen.
• onTouchMove: MOVE during touch DEVICE .
• onTouchStart: On touching a device event is generated.

React identifies every events so that it must have common and consistent behavior across all the browsers. Normally, in normal JavaScript or other frameworks, the onchange event is triggered after we have typed something into a Textfield and then “exited out of it”. In ReactJS we cannot do it in this way.

The explanation is typical and non-trivial:

*”<input type=”text” value=”dataValue”> renders an input textbox initialized with the value, “dataValue”.

When the user changes the input in text field, the node’s value property will update and change. However, node.getAttribute(‘value’) will still return the value used at initialization time that is dataValue.

Form Events:

Mouse Events:

Touch Events: