Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

คุณสมบัติ disabled ของ HTML DOM Input Datetime

คุณสมบัติ disabled ของ HTML DOM Input Datetime ใช้สำหรับกำหนดหรือตรวจสอบว่าช่องกรอกวันที่และเวลา (datetime) ถูกปิดใช้งาน (disabled) หรือเปิดใช้งาน (enabled) ช่องที่ disabled จะไม่สามารถโต้ตอบได้ และข้อมูลจะไม่ถูกส่งไปกับฟอร์มเมื่อ submit

ไวยากรณ์ (Syntax)

การดึงค่า (คืนค่า boolean true/false)

inputDatetimeObject.disabled

การกำหนดค่า disabled

inputDatetimeObject.disabled = booleanValue

ค่า Boolean (Boolean Values)

booleanValueรายละเอียด
trueกำหนดให้ช่อง datetime ถูกปิดใช้งาน (disabled)
falseกำหนดให้ช่อง datetime เปิดใช้งาน (ค่าเริ่มต้น)

ตัวอย่างการใช้งาน

ตัวอย่างด้านล่างแสดงการเปิดใช้งานช่อง datetime ที่ถูก disabled ไว้ตั้งแต่แรก:

<!DOCTYPE html>
<html>
<head>
<title>Input Datetime Disabled</title>
</head>
<body>
<form>
  Date & Time: <input type="datetime" id="datetimeSelect" value="1998-04-09T12:48IST" disabled>
</form>
<button onclick="enableDatetimeInput()">Enable Datetime Input</button>
<div id="divDisplay"></div>
<script>
  var divDisplay = document.getElementById("divDisplay");
  var inputDatetime = document.getElementById("datetimeSelect");
  divDisplay.textContent = 'Datetime Input disabled: ' + inputDatetime.disabled;
  function enableDatetimeInput() {
    inputDatetime.disabled = false;
    divDisplay.textContent = 'Datetime Input disabled: ' + inputDatetime.disabled;
  }
</script>
</body>
</html>

ผลลัพธ์ (Output)

ก่อนคลิกปุ่ม: ช่อง datetime ถูก disabled (สีจาง ไม่สามารถแก้ไขได้) และแสดงค่า disabled = true หลังคลิกปุ่ม Enable Datetime Input: ช่อง datetime เปิดใช้งานได้ปกติ และแสดง disabled = false

ความแตกต่างระหว่าง disabled และ readOnly: disabled - ไม่ส่งข้อมูลไปกับฟอร์ม, readOnly - ส่งข้อมูลไปกับฟอร์มได้ปกติ