HTML DOM Input Time stepUp Method

HTML Web Development Front End Technology

The HTML DOM Input Time stepUp() method defines the number of minutes the Time field should increase.

Syntax

Following is the syntax −

Calling stepUp() method with a number, which by default is equal to 1

inputTimeObject.stepUp(number)

Example

Let us see an example of Input Time stepUp method −

Live Demo

<!DOCTYPE html>
<html>
<head>
<title>Input Time stepUp()</title>
<style>
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   * {
      padding: 2px;
      margin:5px;
   }
   input[type="button"] {
      border-radius: 10px;
   }
</style>
</head>
<body>
<form>
<fieldset>
<legend>Time-stepUp( )</legend>
<label for="TimeSelect">Clock :
<input type="time" id="TimeSelect" value="12:52">
</label>
<input type="button" onclick="changeStep(10)" value="Increase by 10">
<input type="button" onclick="changeStep(25)" value="Increase by 25">
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var inputTime = document.getElementById("TimeSelect");
   function changeStep(myStepUp) {
      inputTime.stepUp(myStepUp);
      divDisplay.textContent = 'Current Step: '+myStepUp;
   }
</script>
</body>
</html>