คุณสมบัติ type ของ HTML DOM Input Datetime ใช้สำหรับดึงหรือกำหนดชนิดของช่องกรอกข้อมูล (input type) สำหรับ datetime
ไวยากรณ์ (Syntax)
การดึงค่า (คืนค่า string)
inputDatetimeObject.type
การกำหนดค่า type
inputDatetimeObject.type = stringValue
ค่า String ที่รองรับ (String Values)
| stringValue | รายละเอียด |
|---|---|
| date | กำหนดให้ input type เป็น date |
| datetime | กำหนดให้ input type เป็น datetime |
| checkbox | กำหนดให้ input type เป็น checkbox |
| text | กำหนดให้ input type เป็น text |
ตัวอย่างการใช้งาน
ตัวอย่างด้านล่างตรวจสอบ type ของช่อง datetime และแยกวันที่/เวลาเมื่อ type เป็น text:
<!DOCTYPE html>
<html>
<head>
<title>Input Datetime type</title>
</head>
<body>
<form>
<div> Date of Birth: <input type="datetime" id="datetimeSelect" value="2000-09-17T19:22Z"> </div>
</form>
<button onclick="changeType()">Get Time and Date</button>
<div id="divDisplay"></div>
<script>
var divDisplay = document.getElementById("divDisplay");
var inputDatetime = document.getElementById("datetimeSelect");
divDisplay.textContent = 'Input type: ' + inputDatetime.type;
function changeType(){
if(inputDatetime.type === 'text'){
var currDate = inputDatetime.value.split("T")[0];
var currTime = inputDatetime.value.split("T")[1];
}
divDisplay.textContent = 'Input Date: ' + currDate + ', Input Time: ' + currTime;
}
</script>
</body>
</html>
ผลลัพธ์ (Output)
ก่อนคลิกปุ่ม: แสดง type ของช่องปัจจุบัน (datetime) หลังคลิกปุ่ม Get Time and Date: หาก type เป็น text จะแยกแสดงวันที่และเวลาแยกกัน
สังเกต: ในบราวเซอร์ที่ไม่รองรับ datetime จะ fallback เป็น type text อัตโนมัติ
