jQuery.autocomplete 支援中文輸入(firefox)修正方法

來源:互聯網
上載者:User

但唯一遺憾的是,在對中文IME開啟時,firefox3.0中是對中文拼音的自動匹配,而對輸入後的中文無法及時觸發匹配;而在我的IE6.0下,則無此問題。

原因分析:
Autocomplete外掛程式對使用者輸入字元的觸發自動匹配是通過”keydown”事件進行的(可分析jquery.autocomplete.js第 92行),在IE6中,當IME開啟時,輸入的字元是不會觸發”keydown”的,只有中文輸入完畢才觸發之,所以中文輸入和latin文沒有區別的;但在firefox3.0下,無論IME開啟否,按鍵都會觸發”keydown”事件,所以造成中文輸入完畢,自動匹配的是剛才打出的部分中文拼音字母。------所以只有Firefox有問題。

解決方案:
網上查到的最多做法是修改jquery.autocomplete.js第92行,將”keydown”替換為”keyup”,但這個不是根本辦法,雖然這樣改後可在firefox中及時對輸入的中文進行自動匹配,但將原外掛程式中斷行符號、tab等重要的事件機制破壞了,比如這樣改後,如果你的input是在一個form裡的話,斷行符號從原來的將選定項輸入到input中變為了直接提交form表單了,這並不是我們想要的。

我的方法原理是,補充一個原外掛程式觸發查詢的事件,就是當input輸入欄發生字元變化時,重新進行查詢(調用其內部的onChange函數),這裡主要針對firefox而言,因為我們的系統訪問最多的是IE和firefox。而恰好firefox有一個input變化的事件就是oninput,那麼我們只要在原jquery.autocomplete.js第199行,插入如下代碼:
.bind("input", function() {
// @hack:support for inputing chinese characters in firefox
onChange(0, true);
});


插入後,代碼大概如下:

...
...
jQueryinput.unbind();
jQuery(input.form).unbind(".autocomplete");
}).bind("input", function() {
// @hack:support for inputing chinese characters in firefox
onChange(0, true);
});
...

2、支援多次斷行符號選定:
修改91行:
// only opera doesn't trigger keydown multiple times while pressed, others don't work with keypress at all
$input.bind(($.browser.opera ? "keypress" : "keydown") + ".autocomplete", function(event) {
修改為:
// only opera mozilla doesn't trigger keydown multiple times while pressed, others don't work with keypress at all
$input.bind((($.browser.opera || $.browser.mozilla) ? "keypress" : "keydown") + ".autocomplete", function(event) {

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.