jquery text box (input Textare) Event binding Method Tutorial

Source: Internet
Author: User

jquery's event bindings have replaced the original bind with on, and then share the use of bind and the input Textare event for everyone. At present more than 1.7, jquery's event binding has been replaced with on the original bind, next for you to introduce the use of bind and input Textare event, interested friends can refer to the next

(1) JQuery binding Event
Currently more than 1.7, jquery's event bindings have been replaced with the original bind;
Difference: (personal understanding) bind is a binding event to each child node; On is only bound to the parent node, then bubbles to each child node;

Usage: Bind
One event, one method: $ (". class input"). Bind (' click ', Function (e) {...; E.stoppropagation;})
Two events, one method: $ (". class input"). Bind (' Click MouseOver ', function (e) {...; E.stoppropagation;})
Two events, two methods: $ (". class input"). Bind ({click:function (e) {...; E.stoppropagation;}, Mouseover:function (e) {...; E.stoppropagation;} })
On, you can directly replace bind, which means that the above usage applies to on;
In addition, on more than bind two optional parameters
On (events [, selector] [, data], handler (EventObject))

Selector: To bind an element, the above example can be written as: $ (". Class"). Bind (' click ', ' Input ', function (e) {...; E.stoppropagation;})
(It is important to note that there is an event that is not used, that is, "stool" IE unique event: onpropertychange;
Can be used: $ (". class input"). Bind (' PropertyChange ', function (e) {...; E.stoppropagation;})
No response: $ (". Class"). Bind (' propertychange ', ' input ', function (e) {...; E.stoppropagation;})
)

Data: The parameter passed to Event.data, $ (". Class"). Bind (' click ', ' input ', ' 123 ', function (e) {alert (e.data/*123*/); E.stoppropagation;})
(More specific usage can be seen in manual http://api.jquery.com/on/);

(2) Input Textare event
Before doing a text box content real-time change event triggered, with OnKeyUp + onchange, but Onchang must be lost in the text box after the fire, and later found that can be used
(if IE) Onpropertychange + else oninput to handle.

Description
Oninput events are triggered when user input, backspace, delete, cut, paste, and mouse cut and paste (may be slightly different in ie9&ie9+).
(Firefox, Chrome, ie9&ie9+ are supported)
Onpropertychange events are triggered when user input, backspace, delete, cut, paste, and mouse cut and paste
(IE support only).

(3) Common events
Oncut event is triggered when pasting (Ctrl + V), mouse pasting
OnActivate is triggered when the object is set to the active element.
onafterupdate fires on a data-bound object when the associated object in the data source object is successfully updated.
The Onbeforeactivate object is triggered immediately before it is set to the current element.
Onbeforecut is Zhong District removed from the document before the source object is fired.
Onbeforedeactivate fires immediately before the activeelement changes from the current object to another object in the parent document.
Onbeforeeditfocus triggers before an object contained within an editable element enters the UI activation State or the editable container becomes a control selection.
Onbeforepaste fires on the target object before pasting from the system Clipboard to the document in the selected area.
onbeforeupdate fires on a data-bound object before the associated object in the data source object is successfully updated.
Onblur fires when an object loses input focus.
OnChange is triggered when the contents of an object or selection change.
The onclick is triggered when the user clicks the object with the left mouse button.
OnContextMenu is triggered when the user right-clicks the client area to open a context menu.
Oncontrolselect fires when a user is about to make a control selection on the object.
Oncut fires on the source element when an object or selection is deleted from the document and added to the system Clipboard.
OnDblClick is triggered when the user double-clicks an object.
OnDeactivate fires when activeelement changes from the current object to another object in the parent document.
Ondrag is continuously triggered on the source object when the drag operation is performed.
Ondragend triggers on the source object when the user releases the mouse at the end of the drag operation.
OnDragEnter triggers on the target element when the user drags the object to a legitimate drag target.
OnDragLeave triggers on the target object when the user moves the mouse out of a legitimate drag target during a drag operation.
OnDragOver triggers on the target element when the user drags the object across a legitimate drag target.
Ondragstart fires on the source object when the user starts dragging the text selection or selecting the object.
OnDrop triggers on the target object when the mouse button is released during a drag operation.
onerrorupdate triggers on data-bound objects when there is an error updating the associated data in the data source object.
Onfilterchange triggered when a visual filter changes state or completes a transition.
onfocus triggers when the object gets focus.
Onfocusin triggers when the element is about to be set to focus.
Onfocusout triggers immediately after moving the focus to another element, triggering on the element that currently has focus.
OnHelp is triggered when the user presses the F1 key while the browser is in the current window.
OnKeyDown triggered when the user presses the keyboard key.
onkeypress triggered when the user presses the literal key.
OnKeyUp triggered when the user releases the keyboard key.
Onlosecapture triggered when the object loses mouse capture.
OnMouseDown is triggered when the user clicks on an object with any mouse button.
Onmouseenter fires when the user moves the mouse pointer inside the object.
OnMouseLeave fires when the user moves the mouse pointer out of the bounds of the object.
OnMouseMove triggers when the user moves the mouse over an object.
onmouseout fires when the user moves the mouse pointer out of the bounds of the object.
onmouseover fires when the user moves the mouse pointer inside the object.
OnMouseUp triggers when the user releases the mouse button while the mouse is over the object.
OnMouseWheel triggered when the mouse wheel button is rotated.
OnMove triggered when an object is moved.
Onmoveend is triggered when the object stops moving.
Onmovestart is triggered when the object starts moving.
Onpaste fires on the target object when the user pastes data to transfer data from the system Clipboard to the document.
Onpropertychange is triggered when a property change occurs on an object that occurs on an object.
onReadyStateChange is triggered when the object state changes.
OnResize is triggered when the size of the object is about to change.
Onresizeend triggered when the user finishes changing the dimensions of the object in the control's selected area.
Onresizestart is triggered when the user starts to change the dimensions of the object in the control's selected area.
Onselect is triggered when the current selection changes.
triggered when the Onselectstart object will be selected.
Ontimeerror is triggered unconditionally when a specific time error occurs, usually caused by setting the property to an invalid value

jquery text box (input Textare) Event binding Method Tutorial

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.