বিবরণ
HTML DOM Input Range disabled প্রোপার্টি ব্যবহার করা হয় রেঞ্জ স্লাইডার ডিসেবল করা উচিত কিনা সেট বা রিটার্ন করার জন্য। এটি বুলিয়ান মান ব্যবহার করে যেখানে true মানে রেঞ্জ স্লাইডার ডিসেবল করা উচিত এবং false মানে অন্যথা। Disabled প্রোপার্টি ডিফল্টভাবে false সেট করা থাকে। তবে ডিসেবল করা এলিমেন্ট ডিফল্টভাবে স্লেটি রঙের হয় এবং অনক্লিকেবল।
সিনট্যাক্স
Disabled প্রোপার্টি সেট করার সিনট্যাক্স:
rangeObject.disabled = true|false;
এখানে, true= রেঞ্জ স্লাইডার ডিসেবল, false= রেঞ্জ স্লাইডার ডিসেবল নয়। ডিফল্টভাবে false।
উদাহরণ
Input range disabled প্রোপার্টির জন্য একটি উদাহরণ:
<!DOCTYPE html> <html> <body> <h1>Input range disabled Property</h1> <form> <input type="range" id="RANGE1" name="VOL"> </form> <p>Disable the above range slider by clicking on the DISABLE button</p> <button type="button" onclick="disableRange()">DISABLE</button> <p id="Sample"></p> <script> function disableRange() { document.getElementById("RANGE1").disabled=true; document.getElementById("Sample").innerHTML = "The range slider is now disabled" ; } </script> </body> </html>
আউটপুট
এটি নিচের আউটপুট তৈরি করবে:
DISABLE বাটনে ক্লিক করার পর, এখন আপনি স্লাইডার সরাতে পারবেন না:
উদাহরণের ব্যাখ্যা
- আমরা একটি ইনপুট ফিল্ড তৈরি করেছি একটি ফর্মের ভেতরে যার type="range", id="RANGE1", name="VOL"।
- তারপর একটি DISABLE বাটন তৈরি করা হয়েছে যা ক্লিক করলে disableRange() মেথড এক্সিকিউট হবে।
- disableRange() মেথড getElementById() ব্যবহার করে type="range" ইনপুট এলিমেন্ট পায় এবং এর disabled প্রোপার্টি true সেট করে। এটি রেঞ্জ স্লাইডারকে অचল করে দেয় এবং ব্যবহারকারী আর এর সাথে ইন্টারঅ্যাক্ট করতে পারবে না। স্লাইডার এখন ফিক্সড।
