วิธีกำหนดให้องค์ประกอบโฟกัสอัตโนมัติเมื่อโหลดหน้าใน HTML

ใช้แอตทริบิวต์ autofocus เพื่อระบุว่าองค์ประกอบควรได้รับโฟกัสอัตโนมัติเมื่อโหลดหน้าใน HTML

ตัวอย่าง

คุณสามารถลองรันโค้ดต่อไปนี้เพื่อเรียนรู้การใช้งานแอตทริบิวต์ autofocus ใน HTML:

<!DOCTYPE html> 
<html> 
  <body> 
    <p>คลิกที่ปุ่มด้านล่างเพื่อสร้างกล่องแจ้งเตือน</p> 
    <button type="button" autofocus onclick="alert('ยินดีต้อนรับ!')">ผลลัพธ์</button> 
  </body> 
</html>

รายละเอียด:

• ใช้ได้กับ <input>, <button>, <select>, <textarea> และองค์ประกอบฟอร์มอื่นๆ
• หน้าหนึ่งควรมีองค์ประกอบ autofocus เพียงหนึ่งเดียว
• ช่วยปรับปรุง UX โดยเฉพาะฟอร์มล็อกอิน หรือช่องค้นหา