入力タイプ番号の書き込みを無効にするHTML5

Question

タイプ番号のフィールドへの書き込みを無効にする、文字列データを避ける、数字だけを書き込む、スクロールバーのみを有効にする方法は？

<form> 
<input type="number" path="note" min="1" max="20"/> 
</form> 

Answer 1

jQueryの使用を許可または許可されている場合は、type='number'でkeypressを無効にすることができます。

$("[type='number']").keypress(function (evt) { 
    evt.preventDefault(); 
}); 

これにより、入力に上下矢印を使用できますが、キーボード入力は許可されません。

Answer 2

まず、マークアップが間違っています。う（W3Schoolsから）

<input type="number" name="my_number" min="0" max="100" step="1" value="50"/> 

：

<form name="my_form"> 
    <input ...code... 
    <input ...code... 
</form> 

あなたはHTML5を使用して番号を入力したい場合は第二に、あなたがこれを使用することができます：フォームタグは、inputタグを囲む必要があります現在のブラウザの「数字」入力の実装は様々であることを認識しています。

この値は、JavaScriptを使用して参照するか、フォームを使用して転記してください。

Answer 3

いいえスクロールせずに、数字の増分は指定せず、最大長を指定して、コピーを貼り付けません。

下記のフィドルを確認してください。フィドルは、タイプ番号フォームのフィールドに必要な機能を備えています。

HTML

<form class="form-horizontal home" role="form" action="" method="post" id="payment-form" novalidate="novalidate"> 
<label for="number">Mobile number : </label> 
<input class="form-control" id="number" name="number" type="number" data-rule-required="true" aria-required="true" oninput="this.value = this.value.replace(/[^0-9.]/g, ''); this.value = this.value.replace(/(\..*)\./g, '$1');" onKeyDown="if(this.value.length==10 && event.keyCode!=8) return false;"> 
</form> 

CSS

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
    -webkit-appearance: none; 
    margin: 0; 
} 

DEMO - JSFIDDLE