HTML DOM 输入范围 stepDown() 方法
HTML DOM Input Range stepDown()方法用于将滑块控制值减小一个指定数字。如果留空,它将减小 1。如果指定了 step 属性,则 stepdown() 方法将以该属性的倍数递减。例如:如果 step=”20”,则 stepDown(2) 将递减 20*2=40
语法
以下是 Range stepDown() 方法的语法 -
rangeObject.stepDown(number)
此处, number 是用于指定滑块控制减小值的一个强制参数。如果留空,它将减小 1。
范例
让我们看一个 range stepDown() 方法的范例 -
<!DOCTYPE html>
<html>
<body>
<h1>Input range stepDown() method</h1>
<form>
VOLUME <input type="range" id="RANGE1" name="VOL">
</form>
<p>Decrement the slider control value by clicking the below button</p>
<button type="button" onclick="stepDecrement()">DECREMENT</button>
<p id="Sample"></p>
<script>
function stepDecrement() {
document.getElementById("RANGE1").stepDown(10);
}
</script>
</body>
</html>输出
这将生成以下输出 -

点击 DECREMENT 按钮 -

在上述范例中 -
我们创建了一个 input 字段,包含在一个拥有 type =“range, id =“RANGE1” ,name =“VOL” 的表单中 -
<form> VOLUME <input type="range" id="RANGE1" name="VOL"> <form>
然后我们创建了一个 DECREMENT 按钮,用户单击时将执行 stepDecrement() 方法 -
<button type="button" onclick="stepDecrement()">DECREMENT</button>
stepDecrement() 方法使用 getElementById() 方法通过向其传递 id “RANGE1” 来获取具有范围类型的输入字段,并在其上调用 stepDown() 方法,并提供 10 作为减小值。这将使滑块减小 10 -
function stepDecrement() {
document.getElementById("RANGE1").stepDown(10);
}
广告
数据结构
网络
RDBMS
操作系统
Java
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP