時時監聽input內容的改變

2022-09-11 18:54:14 字數 1028 閱讀 5500

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

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

$("#test").bind("input",function());

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

但是,以上**僅在除了ie的瀏覽器才work,那ie該怎麼處理呢? 在ie中有乙個屬性叫做onpropertychange:

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

document.getelementbyid('test').attachevent('onpropertychange',function(e) );

在上面**中的**函式中會傳入乙個引數,為該事件,該事件有很多屬性值,搜尋一下可以發現有乙個我們很關心的,叫做propertyname,也就是當前發生變化的屬性名稱。然後就相當簡單了,只要在**函式中判斷一下是否為我們所要的value,是的話就trigger一下『input』事件。

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

$('#test').on('input',function())

完整帶**:

$('#test').on('input',function())
//for ie

if(document.all));}})

}

實時監聽input值改變

在 web開發中經常會碰到需要動態監聽輸入框值變化的情況,如果使用 onkeydown onkeypress onkeyup 這個幾個鍵盤事件來監測的話,監聽不了右鍵的複製 剪貼和貼上這些操作,處理組合快捷鍵也很麻煩。因此這篇文章向大家介紹一種完美的解決方案 結合html5標準事件 oninput ...

監聽input框值的改變

1 onchange觸發事件必須滿足兩個條件 a 當前物件屬性改變,並且是由鍵盤或滑鼠事件激發的 指令碼觸發無效 b 當前物件失去焦點 onblur 2 onpropertychange的話,只要當前物件屬性發生改變,都會觸發事件,但是它是ie專屬的 3 oninput是onpropertychan...

監聽webbrowser內容改變

論壇上一位朋友發貼想實現這樣功能 在webbrowser 編輯狀態 中輸入 然後能捕獲隨後輸入的幾個字元。貼子見 監聽鍵盤事件有兩個缺陷 1.它只能監聽到ascii字元,如果輸入漢字則不響應。2.事件發生時,字元還未真正出現在webbrowser中。解決方法首先是實現ihtmlchangesink介...