แก้ไขแล้ว: datalist html

ปัญหาหลักที่เกี่ยวข้องกับ HTML องค์ประกอบคือเบราว์เซอร์ทั้งหมดไม่รองรับ ขณะนี้มีเพียง Chrome, Firefox และ Edge เท่านั้นที่รองรับ องค์ประกอบ. นอกจากนี้ เบราว์เซอร์มือถือบางตัวไม่สนับสนุนองค์ประกอบนี้เช่นกัน ซึ่งหมายความว่าผู้ใช้บนเบราว์เซอร์ที่ไม่รองรับจะไม่สามารถใช้ฟังก์ชันของดาต้าลิสต์ได้

<datalist id="browsers">
  <option value="Chrome">
  <option value="Firefox">
  <option value="Internet Explorer">
  <option value="Opera">
  <option value="Safari">
</datalist>

1. รหัสนี้สร้างองค์ประกอบ HTML ที่เรียกว่า datalist ซึ่งใช้เพื่อสร้างรายการตัวเลือกสำหรับช่องป้อนข้อมูล
2. รายการข้อมูลมีแอตทริบิวต์ id ของ "เบราว์เซอร์"
3. ภายใน datalist มีองค์ประกอบตัวเลือกห้ารายการ แต่ละรายการมีแอตทริบิวต์ค่าที่มีชื่อของเว็บเบราว์เซอร์ (Chrome, Firefox, Internet Explorer, Opera และ Safari)
4. ค่าเหล่านี้จะใช้เป็นคำแนะนำเมื่อผู้ใช้พิมพ์ลงในช่องป้อนข้อมูลที่เกี่ยวข้องกับรายการข้อมูลนี้

แท็ก datalist คืออะไร

HTML แท็กใช้เพื่อเปิดใช้งานคุณสมบัติ "เติมข้อความอัตโนมัติ" องค์ประกอบ มีรายการตัวเลือกที่กำหนดไว้ล่วงหน้าเพื่อแนะนำให้ผู้ใช้พิมพ์ องค์ประกอบรายการข้อมูลใช้เพื่อเปิดใช้งานคุณลักษณะ "เติมข้อความอัตโนมัติ" องค์ประกอบ มีรายการตัวเลือกที่กำหนดไว้ล่วงหน้าเพื่อแนะนำให้ผู้ใช้พิมพ์ เมื่อใช้ จะระบุรายการตัวเลือกที่กำหนดไว้ล่วงหน้าสำหรับ องค์ประกอบ. เบราว์เซอร์จะแสดงเฉพาะตัวเลือกที่เกี่ยวข้องกับสิ่งที่ผู้ใช้พิมพ์ลงในช่องป้อนข้อมูล

ความแตกต่างระหว่าง Datalist และแบบเลื่อนลงคืออะไร

Datalist เป็นองค์ประกอบ HTML ที่ให้รายการตัวเลือกสำหรับผู้ใช้เพื่อเลือก คล้ายกับเมนูแบบเลื่อนลง แต่ข้อแตกต่างที่สำคัญคือผู้ใช้สามารถป้อนค่าของตนเองได้ ผู้ใช้สามารถพิมพ์ในช่องป้อนข้อมูลและรายการข้อมูลจะให้คำแนะนำตามสิ่งที่พวกเขาพิมพ์ ในทางกลับกัน เมนูแบบเลื่อนลงอนุญาตให้ผู้ใช้เลือกจากตัวเลือกที่กำหนดไว้ล่วงหน้าเท่านั้น นอกจากนี้ ด้วยดาต้าลิสต์ ผู้ใช้สามารถพิมพ์ค่าใดๆ ที่ต้องการได้ แม้ว่าค่านั้นจะไม่ได้อยู่ในรายการตัวเลือกก็ตาม

วิธีใช้ datalist ในรูปแบบ HTML

HTML องค์ประกอบที่ใช้เพื่อให้คุณสมบัติ "เติมข้อความอัตโนมัติ" บน องค์ประกอบ ใช้เพื่อแสดงรายการตัวเลือกที่กำหนดไว้ล่วงหน้าแก่ผู้ใช้ขณะที่ป้อนข้อมูล

ในการใช้องค์ประกอบ datalist ก่อนอื่นคุณต้องสร้างฟอร์ม HTML ด้วย องค์ประกอบและให้แอตทริบิวต์ id จากนั้น คุณสามารถเพิ่มองค์ประกอบดาต้าลิสต์ภายในแบบฟอร์มและตั้งค่าแอตทริบิวต์รายการเท่ากับรหัสของช่องป้อนข้อมูล ภายในรายการข้อมูล คุณสามารถเพิ่มอย่างน้อยหนึ่งรายการ

ตัวอย่างเช่น:


กระทู้ที่เกี่ยวข้อง:

แสดงความคิดเห็น