首頁 > web前端 > js教程 > js中的onchange和onpropertychange (onchange無效的解決方案)_javascript技巧

js中的onchange和onpropertychange (onchange無效的解決方案)_javascript技巧

WBOY
發布: 2016-05-16 16:56:17
原創
1451 人瀏覽過

筆者註:今天我在用到onchange事件時沒有任何反應,最後翻查資料才知道Onchange的局限性和不穩定性。而onpropertychange卻能很好的實現尤其是它的即時捕捉性能更是很值得用一下(幸虧有這個性能,做出的東西老闆娘很滿意 o(∩_∩)o...)。

本人也比較懶,自己做的東西也懶的整理下來只能把搜尋到的資料原版拿來個大家分享一下:

IE下,當一個HTML元素的屬性改變的時候,都能透過 onpropertychange來捕捉。例如一個

物件的value屬性被頁面的腳本修改的時候,onchange無法捕獲到,而onpropertychange卻能夠捕獲。 (是即時性捕捉到的)

也就是說onpropertychange能及時捕捉屬性值的變化,而onchange在屬性值改變時也必須使得當前元素失去焦點(onblur)才可以啟動該事件!

如:

例1:

請輸入圖片位址:

當text框中的內容被改變時,圖片就會立刻被顯示出來。而如果用onchange時,改變其值時還需用滑鼠點選空白或其他地方使input元素失去焦點(onblur)才能啟動該事件,圖片顯示才會被改變!

例2:

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

onpropertychange事件太可愛了,我對它一見鍾情

onChange:當前元素失去焦點且元素的內容改變而觸發的事件 [滑鼠與鍵盤的觸發皆可]

所以說當物件的value被腳本改變時不會觸發onChange事件,因為使用者即沒有動滑鼠又沒動鍵盤.

相關標籤:
js
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板