2017-04-04 75 views
-4

下面是我尝试使用上下键可以限制数字大于5的HTML代码。但我需要限制从键盘手动输入。在目前的情况下,我们可以通过键盘输入任何数字并且接受。需要限制键盘的最大值

<input type="number" max="5" min="1"> 
+0

它接受但它会显示作为误差 – Abi

+0

它将接受但是'form。$ valid'将是错误的。 – Sankar

回答

0

这段代码替换输入与最大数量,其示出了最大数量(如果输入数目大于最大数目更大)数目

<!DOCTYPE html> 
<html lang="en-US"> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 

<body> 
    <div ng-app="app" ng-controller="controller"> 

     <h4> Prevent typing value greater than max (i.e 100): 
     <input type="number" min="1" max="100" limit-to-max /> 
     <script type="text/javascript"> 
     var app = angular.module("app", []); 

     app.controller("controller", function($scope) { 

     }); 

     app.directive("limitToMax", function() { 
      return { 
       link: function(scope, element, attributes) { 
        element.on("keydown keyup", function(e) { 
         if (Number(element.val()) > Number(attributes.max) && 
          e.keyCode != 46 // delete 
          && 
          e.keyCode != 8 // backspace 
         ) { 
          e.preventDefault(); 
          element.val(attributes.max); 
         } 
        }); 
       } 
      }; 
     }); 
     </script> 
    </div> 
</body> 

</html>