文本框内容改变触发事件
input 在IE中有onchange事件,但是這個事件所表現的效果不是我們想要的,它所表現的效果為:當input內的內容發現更改時,并不會觸發你所指定的方法(函數),所以一般的人不用使用這個事件,而會使用,onpropertychange 這個事件,,在IE下是可行的。。但是在FF下面呢就不行了。。
于是我從網上找到如下代碼去解決FF下不行
jQuery(function($) {
???????? if (navigator.userAgent.indexOf("MSIE") > 0) {
????????????? document.getElementById('txtABC').attachEvent("onpropertychange", txChange);
????????? }
????????? else if (navigator.userAgent.indexOf("Firefox") > 0) {
????????????? document.getElementById('txtABC').addEventListener("input", txChange2, false);??????????
???????? ?}
???? })
這個方法的原理就是先判斷是哪種瀏覽器,然后使用它們自帶的事件注冊方法去注冊事件。
這個方法有個問題,如果你要兼容N個瀏覽器的話那你不要是寫N個瀏覽器的注冊事件嗎?
于是又一個解決的方法出現了,,
它的原理很簡答,就是監視鍵盤事件,每次獲取鍵盤事件時,都會去判斷是否與前一次內容是否相同,不相同就觸發相關方法(函數)
代碼如下:
var txtValue;
???????
??????? ??? 預加載
??????? jQuery(function($) {
??????????? txtValue = $("#txtABC").val();
??????????? ??? 給txtbox綁定鍵盤事件
??????????? $("#txtABC").bind("keydown", function() {
??????????????? var currentValue = $(this).val();
??????????????? if (currentValue != txtValue) {
??????????????????? TxtChange();
??????????????????? txtValue = currentValue;
??????????????? }
??????????? });
??????? });
??????? //? 目標選擇框文本發生更改時
??????? function TxtChange() {
??????????? alert('');??????????
??????? }
因為大部分瀏覽器都支持,keydown事件,所以這么寫可以兼容大部分瀏覽器。。
轉載于:https://www.cnblogs.com/glorysword/p/onInputContentChange.html
總結
以上是生活随笔為你收集整理的文本框内容改变触发事件的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Linux下Vim工具常用命令
- 下一篇: Fedora-19安装texlive20