iphone手機safari輸入法不支援keyup事件解決方法
阿新 • • 發佈:2019-01-06
問題是這樣的,用input search做模糊搜尋的時候,在鍵盤裡面輸入關鍵詞,會通過ajax後臺查詢,然後返回資料,用input監聽鍵盤keyup事件,在安卓手機是可以的,但是在ios手機自帶的輸入法無效,經過查詢得出以下方法;
起初我想到的是使用 JQ 裡的 change,但是馬上排除此方法,因為 change 是在文字框失去焦點時才會觸發。曲線救國一下,想到用 keydown 來解決。在安卓一切還好,但是在iphone手機上,使用iphone自帶的輸入法這個事件是無法觸發的。所以這個方法也行不通。
隨後我去查詢了一些資料,得出只有原生 js 的 oninput & onpropertychange 符合此要求,經過測試 bind 會繫結類似的事件,那便是 input & propertychange。
以下為JQ例子:
$('input').bind('input propertychange', function() {
//……
});
注:propertychange 是為了相容 IE9 以下版本的。
JS中的 oninput 事件在 IE9 以下版本不支援,需要使用 IE 特有的 onpropertychange 事件替代,這個事件在使用者介面改變或者使用指令碼直接修改內容兩種情況下都會觸發,有以下幾種情況:
修改了 input:checkbox 或者 input:radio 元素的選擇中狀態, checked 屬性發生變化。
修改了 input:text 或者 textarea 元素的值,value 屬性發生變化。
修改了 select 元素的選中項,selectedIndex 屬性發生變化。
JS:
if(isIE)
{
document.getElementById("input").onpropertychange = keys();
}
else //需要用addEventListener來註冊事件
{
document.getElementById("input").addEventListener("input", keys, false);
}