如何在数字处停止 HTML5 范围输入？
Posted
技术标签:
【中文标题】如何在数字处停止 HTML5 范围输入？【英文标题】：How to stop HTML5 range input at a number? 【发布时间】：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！
【参考方案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");
);
【讨论】：
以上是关于如何在数字处停止 HTML5 范围输入？的主要内容，如果未能解决你的问题，请参考以下文章
如何使 html5 滑块（输入类型='范围'）在 Firefox 中工作