Computer >> Máy Tính >  >> Lập trình >> HTML

Đối tượng ngày giờ đầu vào HTML DOM

Đối tượng ngày giờ đầu vào HTML DOM đại diện cho một phần tử HTML đầu vào có kiểu ngày giờ. Ngoài ra, các trình duyệt chính, ngoại trừ safari chỉ sử dụng loại datetime dưới dạng văn bản.

Cú pháp

Sau đây là cú pháp -

Tạo với loại ngày giờ

var datetimeObject = document.createElement(“input”);
datetimeObject.type = “datetime”;

Các thuộc tính

Đây, “datetimeObject” có thể có các thuộc tính sau -

Thuộc tính Mô tả
tự động hoàn thành Nó xác định giá trị của thuộc tính autocomplete của trường datetime
tự động lấy nét Nó xác định xem trường datetime có nên được tập trung vào tải trang ban đầu hay không.
defaultValue Nó đặt / trả về giá trị mặc định của trường datetime
bị vô hiệu hóa Nó xác định nếu trường datetime bị tắt / bật
biểu mẫu Nó trả về / đặt giá trị của thuộc tính max của trường datetime
phút Nó trả về / đặt giá trị của thuộc tính min của trường datetime
tên Nó xác định giá trị của thuộc tính name của trường datetime
readOnly Nó xác định trường datetime chỉ được đọc hay không
bắt buộc Nó xác định xem trường ngày giờ có bắt buộc phải được điền để gửi biểu mẫu hay không
bước Nó xác định giá trị của thuộc tính bước của trường datetime
loại Nó trả về kiểu phần tử biểu mẫu của trường datetime
giá trị Nó xác định giá trị của thuộc tính value của trường datetime

Giá trị Boolean

Và, các phương pháp sau -

booleanValue Chi tiết
stepDown Nó xác định số mà trường datetime sẽ giảm xuống.
stepUp Nó xác định số mà trường datetime sẽ tăng lên.

Ví dụ

Hãy để chúng tôi xem ví dụ về Ngày giờ nhập tối thiểu tài sản -

<!DOCTYPE html>
<html>
<head>
<title>Input Datetime Min</title>
</head>
<body>
<form>
Date & Time: <input type="datetime" id="dateTime" name="DateSelect" value="2009-6-24T20:49Z" min="2008-12-31T23:59:59Z">
</form>
<button onclick="minDateDecrease()">Decrease min age bar</button>
<div id="divDisplay"></div>
<script>
   var inputDatetime = document.getElementById("dateTime");
   var divDisplay = document.getElementById("divDisplay");
   divDisplay.textContent = 'Minimum Age Bar: '+inputDatetime.min;
   function minDateDecrease() {
      inputDatetime.min = '2010-12-31T23:59:59Z';
      divDisplay.textContent = 'Minimum Age Bar: '+inputDatetime.min;
   }
</script>
</body>
</html>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

Trước khi nhấp vào ‘Giảm thanh độ tuổi tối thiểu’ nút -

Đối tượng ngày giờ đầu vào HTML DOM

Sau khi nhấp vào ‘Giảm thanh độ tuổi tối thiểu’ nút -

Đối tượng ngày giờ đầu vào HTML DOM