有沒有辦法在 type=“number” 輸入字段中捕獲字母？

Question

我有這個輸入字段：

<input type="number" class="col-sm-12" id="scanner" autofocus>

現在，您可以將任何內容掃描到其中，如果掃描的數據包含除數字以外的任何內容，則會將其刪除。 這適用於 Android webView 移動應用程序，當此掃描儀具有焦點時，我們只想顯示數字鍵盤，這就是為什么它是“數字”類型的原因。

任何人都知道即使輸入字段的類型為“數字”而不將其更改回類型=“文本”，我如何捕獲這些字母？

Answer 1

不， input字段的numbers屬性會刪除值，並且從我發現的內容中無法捕獲這些值，因為有一個隱式regex應用於input字段。

但是，如果它們對您有價值，您可以嘗試進行自己的驗證並抓住這些信件。

請參閱下文如何實現這一點。

首先，將字段類型屬性設置回text ，即

<input type="text" placeholder="Enter Number"/>

您只能使用正則表達式從字符串中獲取字母：

/[^a-zA-Z]+/g

您只能使用正則表達式從字符串中獲取數字：

/\D/g

應用onkeyup事件來監控字段的輸入：

onkeyup="validate(this)

最終解決方案監控onkeyup事件，去掉字母，只保留數字。 但是，它會捕獲var中的字母以供以后使用。

 <script> function validate(element) { var letters = element.value.replace(/[^a-zA-Z]+/g, ''); var numbers = element.value.replace(/\D/g,''); element.value = numbers; } </script> <input type="text" onkeyup="validate(this)" placeholder="Enter Number"/>

另請參閱JSFiddle

編輯：

如果您不喜歡字母的顯示方式，然后立即從輸入中刪除，則需要監視keydown事件並將每個字母/符號與它們的 keyCode 匹配。

可以在這里找到一個實現：如何防止在輸入字段中輸入無效字符

Javascript 密鑰代碼的完整列表可在此處找到： Javascript 字符代碼（密鑰代碼）

Answer 2

number 類型的輸入字段允許使用字母 e（表示指數）。 所以你應該可以通過輸入字母 e 來測試你的方法。