如何在数字处停止 HTML5 范围输入？答案

【问题标题】：How to stop HTML5 range input at a number?如何在数字处停止 HTML5 范围输入？
【发布时间】：2015-05-30 16:41:37
【问题描述】：

我正在使用 angularjs 将范围滑块停止在 75，但这不是一个好方法。有人可以指导我怎么做吗？ [编辑在 max=75 回答后澄清] 请记住，我确实想显示总数 100 或最大比例，但仍想限制为 75% 或 75。

<html ng-app="root">
<body>
    <div ng-controller="index">{{message}}
        <input type=range ng-model="data.sl" id=sl />
        <input type=text ng-model="data.sl" />
    </div>
</body>
</html>
<script src="angular.js"></script>

angular.module('root', [])
.controller("index", ["$scope", function ($scope) {
    $scope.message = "Hello World!";
    $scope.data = {};
    $scope.data.sl = 12;
    $scope.$watch('data.sl',function(nv,ov){
        if(nv==ov)return;

        if(nv >= 75){
            document.getElementById("sl").stepDown(10);
            console.log("going up");
        }
    });
}]);

【问题讨论】：

<input type="range" max="100">
^就是这样
不，我确实想显示最大值 100，但仍停留在 75！

标签： javascript angularjs html html-input

【解决方案1】：

只需使用max 属性来限制范围输入的最大值。像这样：

<input type="range" value="0" max="75">

有关更多信息，您可以查看 MDN 的文档about the input element。

【讨论】：

不，我确实想显示最大值 100，但仍停留在 75！我不是新手:)

【解决方案2】：

我去：

    $scope.$watch('data.sl',function(nv,ov){
    if(nv==ov)return;

    if(nv >= 75){
        //document.getElementById("sl").stepDown(10);
        $scope.data.sl=75;
        console.log("going up");
    }
    if(nv <= 25){
        //document.getElementById("sl").stepDown(10);
        $scope.data.sl=25;
        console.log("going down");
    }
});

【讨论】：