心得：我們都知道inoput有一個change事件，但是是在input元素失去焦點的時候發生，不能時時的監聽input內容的改變。

　　　剛開始的時候我是想用setInterval設置計時器的原理定時監聽input內容的改變，但是結果差強人意，效果一點也不好，有時候操做過快還會出現undefined的情況。

解決方法：通過閱讀資料了解到input有意的input事件在大多當今主流的瀏覽器都能實現對input輸入內容的時時監聽；

　　　　<input id="test"/>

　　　　$("#test").bind("input",function(){console.log("內容變化了");});

　　　　由於公司項目是兼容到IE10,還有火狐，谷歌瀏覽器，360是中國人可能用的比較多的瀏覽器，360瀏覽器在中文輸入的情況下，按住shift+字母然後回車的方法輸入大寫字母，用keyup,keydown,keypress事件都不能獲取當前變化的內容，而是之前的內容,input事件很好的解決了這一兼容性問題。

但是，以上代碼僅在除了ie的瀏覽器才work，那ie該怎麽處理呢？ 在ie中有一個屬性叫做onpropertychange：

<input id="test" onpropertychange="alert(‘change‘);" type="text" />

經過調試後馬上就會發現，這個屬性是在元素的任何屬性變化時都會起作用，包括我們這裏所提到的value，但至少是起作用了，那接下來的任務就是篩選出property為value的變化。

document.getElementById(‘test‘).attachEvent(‘onpropertychange‘,function(e) {
    if(e.propertyName!=‘value‘) return;
    $(that).trigger(‘input‘);
});

在上面代碼中的回調函數中會傳入一個參數，為該事件，該事件有很多屬性值，搜尋一下可以發現有一個我們很關心的，叫做propertyName，也就是當前發生變化的屬性名稱。然後就相當簡單了，只要在回調函數中判斷一下是否為我們所要的value，是的話就trigger一下‘input’事件。

然後，就可以在主流瀏覽器中統一用這樣的方式來監聽‘input’事件了。

$(‘#test‘).on(‘input‘,function(){
    alert(‘input‘);
})

完整帶代碼：

$(‘#test‘).on(‘input‘,function(){
    alert(‘input‘);
})

//for ie
if(document.all){
    $(‘input[type="text"]‘).each(function() {
        var that=this;

        if(this.attachEvent) {
            this.attachEvent(‘onpropertychange‘,function(e) {
                if(e.propertyName!=‘value‘) return;
                $(that).trigger(‘input‘);
            });
        }
    })
}

時時監聽input內容的改變