需要限制键盘的最大值答案

【问题标题】：Need to restrict Max value from keyboard需要限制键盘的最大值
【发布时间】：2017-08-29 04:50:40
【问题描述】：

下面是我正在尝试使用向上和向下键限制大于 5 的数字的 HTML 代码。但我需要限制从键盘手动输入。在当前场景下，我们可以通过键盘输入任意数字，并且它正在接受。

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

【问题讨论】：

接受但会显示为错误
它会接受，但form.$valid 会是假的。

标签： angularjs html

【解决方案1】：

这段代码将输入的数字替换为显示最大数字的最大数字（如果输入的数字大于最大数字）

<!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>

【讨论】：