কম্পিউটার টিউটোরিয়াল

HTML DOM Input Range value প্রোপার্টি


বিবরণ

HTML DOM Input Range value প্রোপার্টি type="range" ইনপুট এলিমেন্ট এবং value অ্যাট্রিবিউটের সাথে জড়িত। এটি স্লাইডার কন্ট্রোলের value অ্যাট্রিবিউটের মান রিটার্ন করতে বা সেট করতে ব্যবহৃত হয়। Value অ্যাট্রিবিউট ডিফল্ট মান হতে পারে বা স্লাইডার টেনে দেওয়ার সময় সেট করা মান।

সিনট্যাক্স

Value প্রোপার্টি সেট করার সিনট্যাক্স:

rangeObject.value = text;

এখানে, text হলো রেঞ্জ স্লাইডার কন্ট্রোলের জন্য মান নির্দেশ করার জন্য।

উদাহরণ

Input range value প্রোপার্টির জন্য একটি উদাহরণ:

<!DOCTYPE html> <html> <body> <h1>Input range Value property</h1> <form> VOLUME <input type="range" id="RANGE1" name="VOL"> </form> <p>Get the above element value by clicking the below button</p> <button onclick="getValue()">Get Value</button> <p id="Sample"></p> <script>    function getValue() {       var t = document.getElementById("RANGE1").value;       document.getElementById("Sample").innerHTML = "The value for the radio button is : "+t;    } </script> </body> </html>

আউটপুট

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

HTML DOM Input Range value প্রোপার্টি

"Get Value" বাটনে ক্লিক করার পর:

HTML DOM Input Range value প্রোপার্টি

উদাহরণের ব্যাখ্যা

  • আমরা একটি ইনপুট ফিল্ড তৈরি করেছি একটি ফর্মের ভেতরে যার type="range", id="RANGE1", name="VOL"।
  • তারপর একটি "Get Value" বাটন তৈরি করা হয়েছে যা ক্লিক করলে getValue() মেথড এক্সিকিউট হবে।
  • getValue() মেথড getElementById() ব্যবহার করে ইনপুট এলিমেন্ট পায় এবং এর "value" অ্যাট্রিবিউটের মান t ভেরিয়েবলে অ্যাসাইন করে। এই ভেরিয়েবলটি "Sample" id वाले প্যারাগ্রাফে innerHTML প্রোপার্টি ব্যবহার করে প্রদর্শন করা হয়।
  1. HTML DOM Input Range max প্রোপার্টি

  2. HTML DOM Input Range form প্রোপার্টি

  3. HTML DOM Input Range disabled প্রোপার্টি

  4. HTML DOM Input Range autofocus প্রোপার্টি