2012-04-03 46 views
2
按鍵事件

大多數Web開發人員知道,僅限制號碼錶單輸入不工作,你可以做這樣的事情:event.preventDefault()在Android

$(function() { 
    $("#foobar").keypress(function(e) { 
    if($.inArray(e.which, range(48, 57)) == -1) { 
     e.preventDefault(); 
     return false; 
    } 
    }); 
}); 

function range(start, end) { 
    var range = []; 

    for(var i = start; i <= end; i++) { 
     range.push(i); 
    } 

    return range; 
} 

不幸的是,這並不完全使用默認瀏覽器在Android上完成工作。 ( iPhone和 其他的Android瀏覽器都沒有經過測試,這樣他們就可以從同樣的問題受到影響。在測試了一個iPhone 4S,它沒有這個問題。)

在Android,讓我們說你先鍵入「 F」。什麼都沒發生。真棒。等一下。然後輸入「a」。怎麼了? 「f」被放入輸入字段!你輸入「c」,將「a」放入現場。等等。無論以前輸入的字符是什麼,這就是投入該領域的東西。

Here's a jsFiddle that demonstrates the issue.

小提琴正常工作在桌面上,而是嘗試在Android(手機或模擬器)。我已經測試了Android 2.3.6和2.2。

以前有誰碰到過這個?任何方向將不勝感激!目前,解決方法是立即刪除非數字字符(在keyup事件中)。

更新:Here is a fiddle表明正在達到preventDefault()。問題似乎是,而不是阻止,它只是延遲(直到下一個事件)。

+0

僅供參考,這不允許後退退格等... – 2012-04-03 22:42:14

+0

我剛剛發佈了最低限度重現問題。在我們的「真實」代碼中,我們還允許退格,刪除,製表符,轉義,Ctrl + A,主頁,結束語,左側和右側。 :) – 2012-04-03 22:54:07

+0

從我可以告訴,這似乎是由自動完成/正確。例如,如果我輸入「an」,只顯示「a」,我點擊「Android」並填入「Androi」。似乎只有最後一封信被看到和處理。不同於粘貼事件(也允許輸入無效字符)。 – 2012-06-13 10:56:07

回答

2

一個完全不同的方法將使用<input type="number">並依靠瀏覽器提供適當的接口/過濾(移動瀏覽器很容易)。它沒有修復代碼,但應該避免這個問題,看起來像一個錯誤,說實話。

+0

這實際上是個好主意。在Android上給你一個數字鍵盤,所以這可能是一個更好的方法。 (不會阻止來自硬件鍵盤的無效輸入,但這是服務器端驗證的目的。)明天我將由我的團隊運行它。謝謝。 – 2012-04-04 00:39:55

1

瘋狂的猜測:也許Androids在​​階段註冊輸入。你可以嘗試這兩個事件。

+0

我試過keydown(原始代碼),按鍵和鍵盤......以及它們的每一個組合。 – 2012-04-03 23:56:20

0

好,我打了這個有點,這是運行在我的Andriod罰款:

var reserved = [0,8] 

$(function() 
{ 
    $("#foobar").keypress(function(e) 
    { 
     if($.inArray(e.which, reserved) < 0 && ((e.which < 48) || (e.which > 57))) 
     { 
      e.preventDefault(); 
      return false; 
     } 
    }); 
}); 

http://jsfiddle.net/HW794/1/embedded/result/

可能是機器人不會像調用FN? (範圍)

+0

您測試的Android版本是什麼?我剛剛試用了運行2.3.6的Nexus One,不幸的是問題仍然存在。奇怪的是,似乎只有當輸入的第一個字符是字母時纔會發生。如果我以數字開頭,有時候這個問題不會發生。 – 2012-04-04 00:00:38

+0

通過指向顯示preventDefault()的另一個小提琴的鏈接更新了問題。 – 2012-04-04 00:48:02

+0

真的很奇怪,我沒有問題,它與預期的一樣,我的三星galaxy s2 2.3.6 ... – 2012-04-04 21:28:48

相關問題