2017-07-20 15 views
1

私は、数字として入力タイプを持つ簡単なフォームを作成しようとしています。フォームの最小値と最大値は小数点以下にする必要があります。html形式の最小値と最大値を小数点以下に設定するにはどうすればよいですか?

例えば入力フィールドに有効な数字が0.1,0.2,0.3,0.4であるべきであり、そうで29.5,29.6,29.7,29.8,29.9,30.0

までしたがって、私は以下のコードを挿入し、このコードを見てみてください - 30

<form> 
 
<input type="number" min="0.1" max="30"/> 
 
<input type="submit" value="Submit"/> 
 
</form>

を私は0.1からのものであるとminとmaxのフィールドを設定しますしかし、私は以下の形式で値を入力するために私を求めている予想されるエラーメッセージ

が届かない:

0.1,1.1,2.1,3.1と最後の可能な値は29.1

ですとにかく私が期待しているエラーメッセージを受け取ることはありますか?事前に

感謝:)

+2

inputタグの使用step属性それが動作 – azad

答えて

4

使用step属性は以下の入力タイプで動作するHTMLでstep inbuild属性:数、範囲、日付、日時、日時、ローカル、月、時間、週。ライブ例えば

More Info

<form> 
 
<input type="number" min="0.1" max="30" step="0.1"/> 
 
<input type="submit" value="Submit"/> 
 
</form>

+0

感謝:) – Harish

+0

それが:-)を助けうれしいです –

0

ちょうどあなたのhtmlの小数点増加を得るためにステップを追加します。

1

function ForNumbers(evt){ 
 
    var charCode = (evt.which) ? evt.which : event.keyCode; 
 

 
    if (
 
     //0~9 
 
     charCode >= 48 && charCode <= 57 || 
 
     //number pad 0~9 
 
     charCode >= 96 && charCode <= 105 || 
 
     //backspace 
 
     charCode == 8 || 
 
     //tab 
 
     charCode == 9 || 
 
     //enter 
 
     charCode == 13 || 
 
     //left, right, delete.. 
 
     charCode >= 35 && charCode <= 46 
 
    ) 
 
    { 
 
     //make sure the new value below 20 
 
     if(parseInt(this.value+String.fromCharCode(charCode), 10) <= 30) 
 
      return true; 
 
    } 
 
    
 
    evt.preventDefault(); 
 
    evt.stopPropagation(); 
 
    
 
    return false; 
 
} 
 
document.getElementById('numIpt').addEventListener('keypress', ForNumbers, false);
<input type="text" id="numIpt" maxlength="4" />

1

ちょうどあなたが望むものをMAXLENGTH設定し、結果を取得します。

関連する問題