HTML DOM 입력 범위 stepDown() 메서드는 슬라이더 컨트롤 값을 지정된 숫자만큼 감소시키는 데 사용됩니다. 공백으로 두면 1만큼 감소합니다. 단계 속성이 지정되면 stepdown() 메서드는 그 배수로 감소합니다. 예:step=”20”이면 stepDown(2)이 20*2=40만큼 감소합니다.
구문
다음은 Range stepDown() 메서드의 구문입니다. -
rangeObject.stepDown(number)
여기서 number는 슬라이더 제어 감소 값을 지정하기 위한 필수 매개변수입니다. 공백으로 두면 1씩 감소합니다.
예시
범위 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> 출력
이것은 다음과 같은 출력을 생성합니다 -
감소 버튼을 클릭하면 -
위의 예에서 -
type="range, id="RANGE1" ,name="VOL" −
형식의 입력 필드를 만들었습니다.<form> VOLUME <input type="range" id="RANGE1" name="VOL"> <form>
그런 다음 사용자가 클릭할 때 stepDecrement() 메서드를 실행하는 DECREMENT 버튼을 만들었습니다.
<button type="button" onclick="stepDecrement()">DECREMENT</button>
stepDecrement() 메서드는 getElementById() 메서드를 사용하여 ID "RANGE1"을 전달하여 유형 범위가 있는 입력 필드를 가져오고 감소 값으로 10이 제공된 stepDown() 메서드를 호출합니다. 이렇게 하면 슬라이더가 10 -
감소합니다.function stepDecrement() {
document.getElementById("RANGE1").stepDown(10);
}