คุณสมบัติ autofocus ของ Input Password ใน HTML DOM

คุณสมบัติ autofocus ของ Input Password ใน HTML DOM เกี่ยวข้องกับแอตทริบิวต์ autofocus ขององค์ประกอบ <input> ประเภท password ใช้สำหรับตั้งค่าหรือคืนค่าว่าช่องป้อนรหัสผ่านควรได้รับโฟกัส (focus) อัตโนมัติเมื่อโหลดหน้าเว็บหรือไม่

ไวยากรณ์ (Syntax)

การตั้งค่าคุณสมบัติ autofocus:

passwordObject.autofocus = true|false

• true = ช่องรหัสผ่านจะได้รับโฟกัส
• false = ไม่ได้รับโฟกัส (ค่าเริ่มต้น)

ตัวอย่าง

ตัวอย่างการตรวจสอบค่า autofocus ของช่องรหัสผ่าน:

<!DOCTYPE html>
<html>
<body>
<h1>คุณสมบัติ autofocus ของ Input Password</h1>
Password: <input type="password" id="PASS" autofocus>
<br><br>
<button onclick="FocusVal()">CHECK FOCUS</button>
<p id="Sample"></p>
<script>
  function FocusVal() {
    var hasFocus = document.getElementById("PASS").autofocus;
    document.getElementById("Sample").innerHTML = "ช่องรหัสผ่านมีค่า autofocus ตั้งไว้ที่: " + hasFocus;
  }
</script>
</body>
</html>

ผลลัพธ์

เมื่อโหลดหน้าเว็บ ช่องรหัสผ่านจะได้รับโฟกัสอัตโนมัติ (เคอร์เซอร์กระพริบอยู่ในช่อง)

เมื่อคลิกปุ่ม "CHECK FOCUS" จะแสดง "ช่องรหัสผ่านมีค่า autofocus ตั้งไว้ที่: true"

คำอธิบายโค้ด

• สร้างช่องป้อนรหัสผ่าน id="PASS" มี autofocus attribute (ค่า true)
• สร้างปุ่ม "CHECK FOCUS" เรียกใช้ FocusVal() เมื่อคลิก
• ฟังก์ชัน FocusVal() ดึงช่องป้อนด้วย getElementById("PASS") อ่านค่า .autofocus เก็บใน hasFocus
• แสดงผลในย่อหน้า id="Sample"