Css

input type = 'number' with pattern = '[0-9] *'は、Firefoxでの文字を許可します



Input Type Numberwith Pattern Allows Letters Firefox



解決：

あなたが使うことができますユーザーが文字を入力するのを完全に防ぐための正規表現入力フィールド。

したがって、入力要素に次のイベントリスナーを追加します。onkeypress = 'preventNonNumericalInput（event）'



  
次に、JavaScriptファイルで次の関数を作成します。
 
関数preventNonNumericalInput（e）window.event; var charCode =（typeof e.which == 'undefined'）？ e.keyCode：e.which; var charStr = String.fromCharCode（charCode）; if（！charStr.match（/ ^ [0-9] + $ /））e.preventDefault（）;
私はこれをテストしました、そしてそれはどんな非数値入力とどんな特別な文字も防ぐはずです例えば @＃。/？ NS...
 
 
  
Firefoxは、数字の入力にアルファベットを入力することを制限していないようですが、以下に示すように、フォームの送信時に入力を検証します。両方に注意してくださいeとEは数値入力で有効です。
 
また、MDNによると、
  
 
要素は、入力された値を特定の正規表現パターンに準拠させるためのpattern属性の使用をサポートしていません。これの理論的根拠は、数値入力には数値以外のものを含めることができず、最小属性と最大属性を使用して有効な桁の最小数と最大数を制限できることです。
 
 
 
 
したがって、それを使用する必要はありません。
 
数値入力を選択すると、実際には2つのことが行われます。まずモバイルデバイスでは、入力を入力するために通常のキーボードの代わりにテンキーを表示する必要があります。次に、有効な入力として数字のみを許可する必要があります。したがって、ユーザーがテキストを入力できないようにする場合は、JavaScriptが必要になります。
 
以下の例を見ると、フォームを送信しようとすると、入力が数値でない場合は修正を求めるプロンプトが表示され、パターン属性は不要であることがわかります。
 
.small-input {-moz-appearance：textfield; } .small-input ::-webkit-inner-spin-button {表示：なし; } .small-input ::-webkit-outer-spin-button、.small-input ::-webkit-inner-spin-button {-webkit-appearance：none;マージン：0; }
ボタン 
 
 
   要素 入力された値を特定の正規表現パターンに準拠させるためのpattern属性の使用をサポートしていません 。これの理論的根拠は、数値入力には数値以外のものを含めることができず、上記で説明したように、最小属性と最大属性を使用して有効な桁の最小数と最大数を制限できることです。
 
 
リンク：https：//developer.mozilla.org/en-US/docs/Web/HTML/Element/input/number
 
このリンクをたどって、代わりにJavascriptを使用する必要があります。