วัตถุอีเมลอินพุต HTML DOM แสดงถึงองค์ประกอบ HTML อินพุตที่มีประเภทอีเมล
ไวยากรณ์
ต่อไปนี้เป็นไวยากรณ์ -
การสร้าง โดยพิมพ์อีเมล
var emailObject = document.createElement(“input”); emailObject.type = “email”;
คุณสมบัติ
ที่นี่ “emailObject” สามารถมีคุณสมบัติดังต่อไปนี้ −
แอตทริบิวต์ | คำอธิบาย |
---|---|
เติมข้อความอัตโนมัติ | ให้คำแนะนำตามข้อความที่พิมพ์ก่อนหน้านี้ หากตั้งค่าเป็น "เปิด" |
ออโต้โฟกัส | หากตั้งค่าเป็น true ฟิลด์อีเมลจะเน้นไปที่การโหลดหน้าแรก |
ค่าเริ่มต้น | ตั้งค่า/ส่งคืนค่าเริ่มต้นของฟิลด์อีเมล |
ปิดการใช้งาน | กำหนดว่าฟิลด์อีเมลถูกปิดใช้งาน/เปิดใช้งาน |
แบบฟอร์ม | ส่งกลับการอ้างอิงของแบบฟอร์มล้อมรอบที่มีฟิลด์อีเมล |
ความยาวสูงสุด | ส่งกลับ/ตั้งค่าแอตทริบิวต์ maxLength ของฟิลด์อีเมล |
หลายรายการ | ส่งกลับ/ตั้งค่าหากช่องอีเมลอนุญาตให้รับรหัสอีเมลได้มากกว่าหนึ่งรหัส |
ชื่อ | กำหนดค่าแอตทริบิวต์ชื่อของช่องอีเมล |
แบบ | ส่งกลับ/ตั้งค่าแอตทริบิวต์รูปแบบของช่องอีเมล |
ตัวยึดตำแหน่ง | ตั้งค่า/ส่งคืนสตริงที่โดยทั่วไปใช้เพื่อให้คำแนะนำแก่ผู้ใช้ว่าข้อความที่ป้อนจะมีหน้าตาเป็นอย่างไร |
อ่านอย่างเดียว | กำหนดว่าฟิลด์อีเมลสามารถเปลี่ยนแปลงได้หรือไม่ |
จำเป็น | กำหนดว่าฟิลด์อีเมลจำเป็นต้องกรอกเพื่อส่งแบบฟอร์มหรือไม่ |
ขนาด | กำหนดค่าแอตทริบิวต์ size ของฟิลด์อีเมล |
พิมพ์ | ส่งกลับประเภทขององค์ประกอบแบบฟอร์มของฟิลด์อีเมล |
ค่า | กำหนดค่าแอตทริบิวต์ value ของฟิลด์อีเมล |
ตัวอย่าง
ให้เราดูตัวอย่างของ ป้อนอีเมลหลายรายการ ทรัพย์สิน −
<!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="[email protected]"> </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>
ผลลัพธ์
สิ่งนี้จะสร้างผลลัพธ์ต่อไปนี้ -
ก่อนคลิก 'ยืนยันอีเมล' ปุ่ม −
หลังจากตรวจสอบ 'ยืนยันอีเมล' ปุ่ม −