11

このjsfiddleは、次の問題を示しています。

最も簡単な例は次のとおりです。

<input id="number" type="number" value="1">
console.log(document.getElementById('number').value);

これにより、期待どおりに1がログに記録されます。ただし、これは次のとおりです。

<input id="number" type="number" value="1A">
console.log(document.getElementById('number').value);

値に数字が含まれていないため、空の文字列''をログに記録するだけです。一部のデバイス+ブラウザ（Chromeなど）では、これらの入力に数字以外の文字を入力できます。

これをサポートするデバイス（iPhone、iPadのテンキーなど）にtype = "number"入力が必要なため、これは面倒です。ただし、JavaScriptを使用して、ダーティ入力の入力を停止したいのですが（キーアップ時に値をフェッチする必要があります）、非数値文字を正規表現で置き換えます。

jQueryの.val（）メソッドでも同じ結果が得られるようです。

4

2 に答える 2

4

これは私が探していたものです：

$('input[type=number]').keypress(function(e) {
  if (!String.fromCharCode(e.keyCode).match(/[0-9\.]/)) {
    return false;
  }
});

ユーザー入力の防止は煩わしい場合があることを理解していますが、これでも次のような無効な入力が許可されます1.2.3

しかし、この状況では、まさにそれが私が必要としていたものです。うまくいけば、それは他の誰かに役立つでしょう。提案してくれた@int32_tに感謝します。

于 2013-03-26T23:21:46.333 に答える
-1

<input type=number>数字ではないもの（非常に数学的な意味で、電話番号や郵便番号でも機能しません）に使用することは想定されておらず、値のクリアは意図的に行われます。

デバイスがフォールバックをサポートしているかどうかをテストし、サポートtype=numberしていない場合にのみフォールバックをアタッチできます。

var input = document.createElement('input');
input.setAttribute('type','number');
if (input.type != 'number') { // JS property won't reflect DOM attribute
   polyfill_number();
}

または（特に、番号が郵便番号、シリアル番号などの場合）、次を使用できます。

<input type=text pattern="[0-9]*">

これにより、キーボードも変更されます。

于 2013-03-26T01:07:13.207 に答える