Onchange and onpropertychange in js (the onchange solution is invalid)

Source: Internet
Author: User

Note:Today, when I used the onchange event, I did not respond to it. I checked the information to find out the limitations and instability of Onchange. However, onpropertychange can be well implemented, especially its real-time capturing performance is worth a bit (thanks to this performance, the boss is very satisfied with the o (ready _ blank) o ...).

I am also relatively lazy, and I am also lazy about my work. I can only share the original information I have searched:

IEWhen the attribute of an HTML element changes, it can be captured through onpropertychange. For example

<Input name = "text1" id = "text1"/>

When the object's value attribute is modified by the script on the page,OnchangeBut onpropertychange cannot be captured. (Is captured in real time)

That is to say:OnpropertychangeThe attribute value changes can be captured in a timely manner. When the attribute value changes, onchange must make the current element lose focus (onblur) to activate this event!

For example:

Example 1:

Enter the image address: <input type = "text" name = "mytext" size = "10" value = "" onpropertychange = "document. images ['myimg ']. src = this. value; "/>

When the content in the text box is changed, the image is immediately displayed. When onchange is used, you need to click the blank or other places to make the input element lose focus (onblur) to activate the event, and the image display will be changed!

Example 2:

<INPUT id = "image" style = "WIDTH: 448px; HEIGHT: 22px" onpropertychange = "preview. src = image. value "type =" file "size =" 55 "name =" File1 "runat =" server ">

----------------------------------------------------------------

OnpropertychangeThe incident is so cute that I love it at first sight.

OnChange:Events triggered when the current element loses focus and the element content changes [both mouse and keyboard triggers]

Therefore, the onChange event is not triggered when the object value is changed by the script, because the user does not move the mouse or the keyboard.

Related Article

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.