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

Bootstrap Form Select: สร้างเมนูเลือกตัวเลือก


Element <select> ใช้เมื่อต้องการให้ผู้ใช้เลือกจากหลายตัวเลือก โดยค่าเริ่มต้นจะอนุญาตให้เลือกได้เพียงตัวเลือกเดียว

  • ใช้ <select> สำหรับรายการตัวเลือกที่ผู้ใช้คุ้นเคย เช่น จังหวัด หรือตัวเลข
  • ใช้ multiple="multiple" เพื่ออนุญาตให้ผู้ใช้เลือกได้หลายตัวเลือกพร้อมกัน

ตัวอย่าง

ลองรันโค้ดต่อไปนี้เพื่อนำ Bootstrap form select ไปใช้งาน:

<!DOCTYPE html> <html> 
  <head> 
    <title>Bootstrap Example</title> 
    <meta name = "viewport" content="width = device-width, initial-scale = 1"> 
    <link rel = "stylesheet" href = "https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css"> 
    <script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
    <script src = "https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> 
  </head> 
  <body> 
    <form role = "form"> 
      <div class = "form-group"> 
        <label for = "name">Country</label> 
        <select class = "form-control"> 
          <option>India</option> 
          <option>Australia</option> 
          <option>US</option> 
        </select> 
      </div> 
    </form> 
  </body> 
</html>