หากต้องการปิดการทำงานอัตโนมัติ (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- รหัสผ่านใหม่
การใช้ค่าเฉพาะเจาะจงช่วยให้เบราว์เซอร์เติมข้อมูลได้แม่นยำกว่า