คุณสมบัติ placeholder ของ HTML DOM Input Search ใช้สำหรับตั้งค่าหรือส่งคืนค่าแอตทริบิวต์ placeholder ของช่องค้นหา input คุณสมบัติ placeholder ใช้ให้คำใบ้แก่ผู้ใช้เกี่ยวกับองค์ประกอบ input โดยแสดงข้อความภายในช่อง input ก่อนที่ผู้ใช้จะป้อนข้อมูล ข้อความ placeholder จะเป็นสีเทาโดยค่าเริ่มต้นและไม่ถูกส่งไปกับฟอร์มเหมือนคุณสมบัติ value
ไวยากรณ์
ไวยากรณ์สำหรับการตั้งค่าคุณสมบัติ placeholder:
searchObject.placeholder = text
ที่นี่ text แทนข้อความ placeholder ที่ระบุคำใบ้สำหรับผู้ใช้เกี่ยวกับช่องค้นหา
ตัวอย่าง
มาดูตัวอย่างสำหรับคุณสมบัติ placeholder ของ input search:
<!DOCTYPE html> <html> <body> <h1>earch placeholder property</h1> <form> FRUITS: <input type="search" id="SEARCH1" name="fruits"> </form> <p>เปลี่ยนข้อความ placeholder ของช่องด้านบนโดยคลิกปุ่มด้านล่าง</p> <button onclick="changeHolder()">CHANGE</button> <script> function changeHolder() { document.getElementById("SEARCH1").placeholder = "Search for the fruits here.."; } </script> </body> </html>
ผลลัพธ์
จะได้ผลลัพธ์ดังนี้:
เมื่อคลิกปุ่ม CHANGE:
