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

Đối tượng email đầu vào HTML DOM

Đối tượng email đầu vào HTML DOM đại diện cho một phần tử HTML đầu vào với loại email.

Cú pháp

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

Tạo với loại email

var emailObject = document.createElement(“input”);
emailObject.type = “email”;

Các thuộc tính

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

Thuộc tính Mô tả
tự động hoàn thành Nó cung cấp các đề xuất dựa trên văn bản đã nhập trước đó, nếu được đặt thành 'ON'
tự động lấy nét Nếu được đặt thành true, trường email sẽ được tập trung khi tải trang đầu tiên.
defaultValue Nó đặt / trả về giá trị mặc định của trường email
bị vô hiệu hóa Nó xác định xem trường email có bị tắt / bật hay không
biểu mẫu Nó trả về một tham chiếu của biểu mẫu kèm theo có chứa trường email
maxLength Nó trả về / đặt giá trị của thuộc tính maxLength của trường email
nhiều Nó trả về / đặt nếu một trường email được phép chấp nhận nhiều hơn một Id email
tên Nó xác định giá trị của thuộc tính name của trường email
mẫu Nó trả về / đặt giá trị của thuộc tính mẫu của trường email
trình giữ chỗ Nó đặt / trả về một chuỗi thường được sử dụng để cung cấp gợi ý cho người dùng về văn bản đầu vào sẽ trông như thế nào.
readOnly Nó xác định trường email có thể thay đổi được hay không
bắt buộc Nó xác định xem trường email có bắt buộc phải được điền để gửi biểu mẫu hay không
kích thước Nó xác định giá trị của thuộc tính size của trường email
loại Nó trả về kiểu phần tử biểu mẫu của trường email
giá trị Nó xác định giá trị của thuộc tính value của trường email

Ví dụ

Hãy để chúng tôi xem ví dụ về Nhập nhiều Email tài sản -

<!DOCTYPE html>
<html>
<head>
<title>Input Email multiple</title>
<style>
   form {
      width:70%;
      margin: 0 auto;
      text-align: center;
   }
   * {
      padding: 2px;
      margin:5px;
   }
   input[type="button"] {
      border-radius: 10px;
   }
</style>
</head>
<body>
<form>
<fieldset>
<legend>Email-multiple</legend>
<label for="EmailSelect">Employee Email :
<input type="email" id="EmailSelect" placeholder="jkl@qwerty.com">
</label>
<input type="button" onclick="changeToMultiple()" value="Enable Multiple Emails">
<div id="divDisplay"></div>
</fieldset>
</form>
<script>
   var divDisplay = document.getElementById("divDisplay");
   var inputEmail = document.getElementById("EmailSelect");
   divDisplay.textContent = 'Multiple Emails Allowed: '+inputEmail.multiple;
   function changeToMultiple() {
      inputEmail.multiple = true;
      divDisplay.textContent = 'Multiple Emails Allowed: '+inputEmail.multiple;
   }
</script>
</body>
</html>

Đầu ra

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

Trước khi nhấp vào ‘Xác nhận Email’ nút -

Đối tượng email đầu vào HTML DOM

Sau khi chọn ‘Xác nhận Email’ nút -

Đối tượng email đầu vào HTML DOM