最近要在移動端實現一個文本框實時搜索的功能，即在文本框里每輸入一個字，就向服務器請求一次搜索結果。暫且不考慮性能優化問題，第一時間想到的是用keyup實現：

$('input').on('keyup',function() {
    AjaxRequest();
});

這在安卓上沒有問題，但在iOS上如果使用中文輸入或者輸入法的預設文本，就不會觸發keyup事件，因此也就無法和服務器通信。為解決這個問題，在網上查了些資料，HTML5有專門處理的事件oninput，可以響應實時輸入：

$('input').on('input',function() {
    AjaxRequest();
});

這樣在輸入中文時就能監聽到文本框的變化了。但還是有問題，在輸入中文時，比如“我”字，拼音是“wo”，五筆是"q"，均會向服務器發送三次請求，如果打印出來，會得到“我”、“”、“我”三個值，可我只想在“我”字輸出到文本框以后再發請求，這時候就需要一個專門的compositionstart和compositionend事件來處理這種情況，這是參考資料。

“compositionstart事件觸發于一段文字的輸入之前（類似于keydown事件，但是該事件僅在若干可見字符的輸入之前，而這些可見字符的輸入可能需要一連串的鍵盤操作、語音識別或者點擊輸入法的備選詞）。“

最后，完整代碼如下：

var lock = false;
$('input').on({
    input: function() {
        if(!lock) AjaxRequest(); //這里再調用一次方法是為了響應退格刪除中文
    },
    compositionstart: function() {
        lock = true;
    },
    compositionend: function() {
        lock = false;　　　　　
        AjaxRequest(); //可以響應正常中文輸入，但不響應使用退格刪除中文
    }
});

總結

以上是生活随笔為你收集整理的iOS中文输入法多次触发的问题及解决方案的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。