2015-10-23 131 views
4

如何在輸入類型號碼上設置0到99之間的一個範圍?我使用HTML5屬性(min="0" max="99"),但它不工作,據我所知,某些瀏覽器不支持這種屬性。輸入類型號只允許輸入2個數字

所以我使用這個腳本阻止非數字字符,但我想限制數字爲最大99(僅2位數)。我怎樣才能做到這一點?

另外我想讓用戶使用鍵盤輸入數字。

$(".js-number").numeric(); 

jsFiddle

+3

分鐘= 「2」 最大值= 「2」 簡單HTML5 – CodeLove

+0

@CodeLove的屬性,而不是工作.. – Rayon

+0

'$( 「JS-數」。)數字();'任何庫? – Tushar

回答

2

你的榜樣工程數字()( 「JS-數」)。 ;
但是你可以編輯輸入。
maxlength屬性適用於輸入類型文本,所以我猜javascript驗證是不可避免的。

<input type="number" class="js-number" min="0" max="99" value="0"> 
<script> 
    $(".js-number").bind('keydown', function(e){ 
     var targetValue = $(this).val(); 
     if (e.which ===8 || e.which === 13 || e.which === 37 || e.which === 39 || e.which === 46) { return; } 

     if (e.which > 47 && e.which < 58 && targetValue.length < 2) { 
      var c = String.fromCharCode(e.which); 
      var val = parseInt(c); 
      var textVal = parseInt(targetValue || "0"); 
      var result = textVal + val; 

      if (result < 0 || result > 99) { 
      e.preventDefault(); 
      } 

      if (targetValue === "0") { 
      $(this).val(val); 
      e.preventDefault(); 
      } 
     } 
     else { 
      e.preventDefault(); 
     } 
    }); 
</script> 
+0

它不工作:http://jsfiddle.net/brunodd/gnLz004r/6/ – brunodd

+0

它的工作。只能通過點擊輸入箭頭 – Sagi

+0

才能使用擊鍵編輯它,但這並不理想。我想讓用戶使用鍵盤輸入數字。 – brunodd

0

,你可以這樣設置:如果您刪除$

<input type="text" class="js-number" maxlength="2"> 
+0

輸入類型編號? – Rayon

+0

http://stackoverflow.com/questions/8354975/how-to-add-maxlength-for-html5-input-type-number-element –

+0

你確定這個輸入只接受數字嗎? – Rayon

1
<input class="test-input" type="number" maxlength="12" /> 
<script> 
$('.test-input').unbind('keyup change input paste').bind('keyup change input paste',function(e){ 
    var $this = $(this); 
    var val = $this.val(); 
    var valLength = val.length; 
    var maxCount = $this.attr('maxlength'); 
    if(valLength>maxCount){ 
     $this.val($this.val().substring(0,maxCount)); 
    } 
}); 
</script> 
相關問題