nput中onchange事件已經屬於元老級別了，並且現在同onclick一樣使用頻率很高，然而onchange的機制實際上有很多童鞋並不清楚，我們通過實例來分析這個事件的特征。
觸發onchange
首先頁面有一個input標簽，並且已綁定onchange事件，如：
<input type="text" onchange="console.log(this.value);" />
這個事件要做的動作很簡單，只是把input的值在控制台上打印出來就好。效果：
這個onchange是怎么觸發的呢？經過實驗，大致是以下幾個步驟
一、當input捕獲到焦點后，系統儲存當前值
二、當input焦點離開后，判斷當前值與之前存儲的值是否不等，如果為true則觸發onchange事件。
非IE可以回車觸發
這個行為有點意思，即當input獲取焦點后，不僅是焦點離開時會去校驗當前的值與獲取焦點臨時存儲值是否一致，還會在你敲回車的時候就去干這事。比如，我輸入一些內容以后，我想讓它觸發onchange事件，但又不想使用鼠標點別處，於是敲回車它就觸發一次onchange事件，當然，如果你敲回車的時候，前后兩次的值不相等才會觸發，為了形象的展示這個案例，我們修改頁面代碼的input：
<input type="text" onkeydown="console.log('from onkeydown : ' + event.keyCode);" onchange="console.log('from onchange : ' + this.value);" />
效果如下：
這個例子在FireFox，Chrome，Safari下測試通過。
通過DOM對象賦值不會觸發
雖然表面上感覺是當內容發生變化時，就會觸發onchange事件，但是那只能在頁面上操作。而如果通過dom對象去修改它的value則什么事也不會發生。
如：
通過dom對象賦值后，雖然值發生了變化，但並沒有觸發onchange事件，即使你像下面這樣模擬真實輸入也不管用
實際案例
假如，在實際中，我們有這么一個案例
<input type="text" onchange="a(this);" />
js代碼：
function a(obj){
console.log(obj.value);
}
這個功能在正常的頁面操作下都沒問題，但我希望通過dom對象改變value時也觸發a()函數，那有很多種做法。
第一，比較簡單粗暴，只要賦值手動觸發
截圖中右側兩行代碼，就是先給input賦值，然后再執行a()函數。
第二，直接執行onchange觸發事件
當我給input賦值后，順便觸發onchange事件。
第三，寫一個專有賦值方法
以上兩種，都是只要賦值就觸發a()函數，不太友好，因為也許值並沒有改變。
比如原來input中的值是a，但我給它賦值a以后本應該是賦值前與賦值后的兩個值都相等就不能觸發onchange函數，為了這個需求，我們可以寫一個jQuery方法來實現，簡單易用。
(function($) {
$.fn.update = function(value){
$(this).each(function(){
if(value!=this.value){
this.value = value;
this.onchange();
}
});
};
})(jQuery);
執行結果：
默認，input是空的，所以執行第一個update時 cccc != "" 自然就執行onchange，執行第二個update時， cccc == cccc 於是就不走onchange事件了。
轉載自：http://www.zhixing123.cn/jsp/37858.html