คุณสมบัติ value ของ HTML DOM Input Time ใช้สำหรับดึงหรือกำหนดค่าของแอตทริบิวต์ value ในช่องป้อนเวลา
ไวยากรณ์ (Syntax)
การดึงค่า value
inputTimeObject.value
การกำหนดค่า value
inputTimeObject.value = 'String'
ตัวอย่างการใช้งาน
ตัวอย่างเกมทายเวลา - ตรวจสอบว่าผู้ใช้ทายเวลาถูกต้องหรือไม่
<!DOCTYPE html>
<html>
<head>
<title>Input Time value</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-value</legend>
<label for="TimeSelect">เวลา: </label>
<input type="time" id="TimeSelect" value="00:00">
<input type="button" onclick="checkForGuess()" value="Guess">
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
var divDisplay = document.getElementById("divDisplay");
var inputTime = document.getElementById("TimeSelect");
divDisplay.textContent = 'Guess at what time is the event?';
function checkForGuess() {
if (inputTime.value === '18:30')
divDisplay.textContent = 'Yes you guessed it right. The event starts at ' + inputTime.value;
else
divDisplay.textContent = 'No you guessed it wrong. Have a go again';
}
</script>
</body>
</html>
ผลลัพธ์
คลิก "Guess" ด้วยเวลาผิด - แสดง "No you guessed it wrong. Have a go again"
กรอก 18:30 คลิก "Guess" - แสดง "Yes you guessed it right. The event starts at 18:30"
รูปแบบค่า: ใช้รูปแบบ 24 ชั่วโมง HH:MM หรือ HH:MM:SS หรือ HH:MM:SS.ms