Thuộc tính readOnly của HTML DOM Input Datetime

Thuộc tính readOnly của đối tượng Input Datetime xác định xem người dùng có thể chỉnh sửa giá trị trong trường ngày giờ hay không.

Cú pháp

Lấy giá trị (true/false)

inputDatetimeObject.readOnly

Thiết lập giá trị

inputDatetimeObject.readOnly = booleanValue

Giá trị Boolean

Ví dụ minh họa

Khóa trường ngày giờ sau khi xác nhận:

<!DOCTYPE html>
<html>
<head>
<title>Input Datetime readOnly</title>
</head>
<body>
<form>
  Ngày giờ thi: <input type="datetime" id="datetimeSelect" value="2023-08-24T10:30Z">
</form>
<button onclick="finalizeDatetime()">Xác nhận ngày giờ</button>
<div id="divDisplay"></div>
<script>
  var divDisplay = document.getElementById("divDisplay");
  var inputDatetime = document.getElementById("datetimeSelect");
  divDisplay.textContent = 'Đã khóa ngày giờ: ' + inputDatetime.readOnly;
  function finalizeDatetime() {
    inputDatetime.readOnly = true;
    divDisplay.textContent = 'Ngày giờ thi: ' + inputDatetime.value;
  }
</script>
</body>
</html>

Kết quả

Ban đầu trường có thể chỉnh sửa. Sau khi nhấn "Xác nhận ngày giờ", trường chuyển sang chỉ đọc (readOnly = true) và hiển thị giá trị đã chọn.