Đối tượng Input Datetime trong HTML DOM đại diện cho phần tử <input type="datetime">. Lưu quan trọng: Kiểu datetime đã bị loại khỏi chuẩn HTML5 hiện đại; hầu hết trình duyệt (trừ Safari) hiển thị nó như một ô nhập văn bản (type="text"). Nên sử dụng datetime-local thay thế.
Cú pháp tạo đối tượng
var datetimeObject = document.createElement("input");
datetimeObject.type = "datetime";
Các thuộc tính (Attributes)
| Thuộc tính | Mô tả |
|---|---|
| autocomplete | Giá trị thuộc tính autocomplete của trường datetime. |
| autofocus | Tự động focus khi tải trang. |
| defaultValue | Giá trị mặc định của trường. |
| disabled | Vô hiệu hóa/bật trường. |
| form | Tham chiếu đến form chứa trường (lưu ý: tài liệu gốc ghi nhầm "max"). |
| min | Giá trị ngày giờ tối thiểu. |
| max | Giá trị ngày giờ tối đa. |
| name | Thuộc tính name của trường. |
| readOnly | Chỉ đọc hay không. |
| required | Bắt buộc nhập hay không. |
| step | Khoảng bước nhảy (giây/mili-giây). |
| type | Loại phần tử form (trả về "datetime" hoặc "text"). |
| value | Giá trị hiện tại của trường. |
Các phương thức (Methods)
| Phương thức | Mô tả |
|---|---|
| stepUp(n) | Tăng giá trị lên n đơn vị (mặc định 1). |
| stepDown(n) | Giảm giá trị đi n đơn vị (mặc định 1). |
Ví dụ minh họa (sử dụng thuộc tính min)
<!DOCTYPE html>
<html>
<head>
<title>Input Datetime Min</title>
</head>
<body>
<form>
Ngày & Giờ: <input type="datetime" id="dateTime" name="DateSelect" value="2009-6-24T20:49Z" min="2008-12-31T23:59:59Z">
</form>
<button onclick="minDateDecrease()">Giảm mốc tối thiểu</button>
<div id="divDisplay"></div>
<script>
var inputDatetime = document.getElementById("dateTime");
var divDisplay = document.getElementById("divDisplay");
divDisplay.textContent = 'Mốc tối thiểu: ' + inputDatetime.min;
function minDateDecrease() {
inputDatetime.min = '2010-12-31T23:59:59Z';
divDisplay.textContent = 'Mốc tối thiểu mới: ' + inputDatetime.min;
}
</script>
</body>
</html>
Kết quả
Nhấn nút để thay đổi thuộc tính min của trường datetime.