HTML機能していない番号の入力最小値と最大値が正しく

Question

私はtype=number入力フィールドを持っていると私はそれのためにminとmax値を設定しています

<input type="number" min="0" max="23" value="14"> 

私は少しの矢印を使用してレンダリングUIで時刻を変更した場合入力フィールドの右側にあるすべてが正常に動作します.23を超えたり0未満にすることはできません。しかし、手動で（キーボードを使用して）数字を入力すると、どちらの制限も有効になりません。

誰でも希望の番号を入力できないようにする方法はありますか？

Answer 1

HTML5 maxとminでは、数値を入力するためにのみ数値を入力できます。しかし、このような変更を行うには、JavaScriptまたはjQueryを使用する必要があります。

$(function() { 
 
    $("input").keydown(function() { 
 
    // Save old value. 
 
    $(this).data("old", $(this).val()); 
 
    }); 
 
    $("input").keyup(function() { 
 
    // Check correct, else revert back to old value. 
 
    if (parseInt($(this).val()) <= 23 && parseInt($(this).val()) >= 0) 
 
     ; 
 
    else 
 
     $(this).val($(this).data("old")); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<input type="number" min="0" max="23" value="14" />

Answer 2

たぶん代わりのからユーザーを制限するだろうあなたは「範囲」タイプを使用することができ、「番号」タイプを使用して：私はひとつのアイデアは、data-属性を使用して保存し、古い値でありますあなたがまだ答えを探しているならば、入力タイプ= "番号"を使うことができるので、スライドバーを使用するので数字を入力して、それを現在の数字を表示するように設定したい場合は

Answer 3

それがそのために設定されている場合
最小最大の仕事は：
1名
2-MAXLENGTH
3サイズ
4分
5-MAX
はちょうどコピーし、それ

<input name="X" maxlength="3" size="2" min="1" max="100" type="number" /> 

とき（キーボードを使用して）数値/文字を手動で入力し、文字を入力すると小さなメッセージが表示されます "範囲外の数字の場合は数字を入力してください"それ以上の値を選択してください..より

Answer 4

場合によっては、minおよびmaxの代わりにpatternを使用できます。 requiredと正しく動作します。