Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

วิธีปิดการทำงานอัตโนมัติ (Autocomplete) ของช่องกรอกข้อมูล HTML

หากต้องการปิดการทำงานอัตโนมัติ (autocomplete) ของช่องกรอกข้อมูล ให้เพิ่มแอตทริบิวต์ autocomplete="off" ลงในองค์ประกอบ <input>

ตัวอย่างโค้ด

<!DOCTYPE html>
<html>
<head>
  <title>ตัวอย่าง Autocomplete On/Off</title>
  <style>
    input {
      font-size: 18px;
      padding: 10px;
      margin: 10px;
      border: 1px solid grey;
    }
  </style>
</head>
<body>
  <h1>ตัวอย่างการเปิด/ปิด Autocomplete</h1>
  <form>
    ชื่อ: <input type="text" name="firstName" autocomplete="off"><br>
    นามสกุล: <input type="text" name="lastName" autocomplete="on"><br>
    <input type="submit">
  </form>
  <h2>ลองพิมพ์ข้อมูลในช่องด้านบนและรีเฟรชหน้าจอเพื่อดูการทำงานของ Autocomplete</h2>
</body>
</html>

ผลลัพธ์

โค้ดจะแสดงฟอร์ม 2 ช่อง:

  • ช่อง "ชื่อ" - ปิด autocomplete (autocomplete="off")
  • ช่อง "นามสกุล" - เปิด autocomplete (autocomplete="on")

เมื่อกรอกข้อมูลและส่งฟอร์มครั้งแรก แล้วรีเฟรชหน้าจอ ช่องที่เปิด autocomplete จะแสดงข้อความแนะนำจากข้อมูลที่เคยกรอกไว้ ขณะที่ช่องที่ปิดจะไม่แสดง

ข้อมูลเพิ่มเติม

แอตทริบิวต์ autocomplete ยังรองรับค่าอื่นๆ เช่น:

  • name - ชื่อเต็ม
  • email - อีเมล
  • username - ชื่อผู้ใช้
  • current-password - รหัสผ่านปัจจุบัน
  • new-password - รหัสผ่านใหม่

การใช้ค่าเฉพาะเจาะจงช่วยให้เบราว์เซอร์เติมข้อมูลได้แม่นยำกว่า