HTML <datalist> แท็ก

  • หน้าก่อน <data>
  • หน้าต่อไป <dd>

คำอธิบายและวิธีใช้

<datalist> อิเล็มนต์ <input> อิเล็มนต์กำหนดรายชื่อตัวเลือกที่เป็นไปได้

<datalist> ฉันนานวาท <input> อิเล็มนต์เลือกตัวเลือกเพื่อให้เกิดความสะดวกในการกรอกข้อมูล ผู้ใช้จะเห็นรายชื่อตัวเลือกที่ปรับตัวตามข้อมูลที่เข้าพิมพ์

<datalist> คุณสมบัติ id ของอิเล็มนต์ <input> ของอิเล็มนต์ รายละเอียดคุณสมบัติ list(จะเชื่อมโยงกันด้วยกัน)。

ดูเพิ่มเติมที่:

คู่มืออ้างอิง HTML DOM:วัตถุ Datalist

ตัวอย่าง

รายชื่อข้อมูลที่มีตัวเลือกก่อนระบุ (เชื่อมโยงกับ <input> อิเล็มนต์):

<label for="browser">โปรดเลือกเบราเซอร์ของคุณจากรายชื่อ:</label>
<input list="browsers" name="browser" id="browser">
<datalist id="browsers">
  <option value="Edge">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>

ลองด้วยตัวเอง

คุณสมบัติโลก

<datalist> แบบต่างๆของแทกยังสนับสนุน คุณสมบัติโลกใน HTML.

คุณสมบัติเหตุ

<datalist> แบบต่างๆของแทกยังสนับสนุน คุณสมบัติเหตุใน HTML.

การตั้งค่า CSS โรงแรม

โดยมากแล้วบราวเซอร์จะแสดงค่าเริ่มต้นตามที่นี้ <datalist> ตัวแปร:

datalist {
  display: none;
}

การสนับสนุนโปรแกรมบราวเซอร์

ตัวเลขในตารางระบุตัวเว็บเบราส์เรียกใช้เอลิเมนต์นี้ในฐานะที่เต็มที่

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
20.0 10.0 4.0 12.1 9.5
  • หน้าก่อน <data>
  • หน้าต่อไป <dd>