HTML DOM Select multiple প্রপার্টি

HTML DOM select multiple প্রপার্টি ড্রপ-ডাউন লিস্ট থেকে একাধিক অপশন নির্বাচন করা যাবে কিনা তা ফেরত দেয় এবং পরিবর্তন করে।

সিনট্যাক্স

নিচে সিনট্যাক্স দেওয়া হলো:

১. multiple ফেরত দেওয়া

object.multiple

২. multiple পরিবর্তন করা

object.multiple = true | false

উদাহরণ

HTML DOM select multiple প্রপার্টির উদাহরণ:

<!DOCTYPE html> <html> <head> <style> 
  html{ height:100%; }
  body{ text-align:center; color:#fff; background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat; height:100%; }
  p{ font-weight:700; font-size:1.2rem; }
  .drop-down{ width:50%; border:2px solid #fff; font-weight:bold; padding:8px; background-color:#ffffff24; } 
  .btn{ background:#0197F6; border:none; height:2rem; border-radius:2px; width:45%; margin:2rem auto; display:block; color:#fff; outline:none; cursor:pointer; } 
  .show{ font-size:1.1rem; font-weight:bold; } 
</style> </head> <body> 
<h1>DOM Select multiple Property Demo</h1> 
<p>Hi, Select your favourite subject:</p> 
<select class='drop-down'> 
  <option>Physics</option> 
  <option>Maths</option> 
  <option>Chemistry</option> 
  <option>English</option> 
</select> 
<button onclick="multiple()" class="btn">Click to select multiple</button> 
<div class="show"></div> 
<script> 
  function multiple() { 
    var dropDown = document.querySelector(".drop-down"); 
    var showMsg = document.querySelector(".show"); 
    dropDown.multiple = true; 
    showMsg.innerHTML = "Now you can select multiple options using ctrl/shift"; 
  } 
</script> </body> </html>

আউটপুট

এটি নিচের আউটপুট তৈরি করবে:

HTML DOM Select multiple প্রপার্টি

"Click to select multiple" বাটনে ক্লিক করলে ড্রপ-ডাউন লিস্টে একাধিক অপশন নির্বাচন করা যাবে।

HTML DOM Select multiple প্রপার্টি