বিবরণ
HTML DOM Input Range autofocus প্রোপার্টি HTML <input> এলিমেন্টের autofocus অ্যাট্রিবিউটের সাথে জড়িত। এই প্রোপার্টি ব্যবহার করা হয় সেট বা রিটার্ন করার জন্য যে ইনপুট রেঞ্জ স্লাইডার পেজ লোড হলে অটোমেটিক্যালি ফোকাস পাবে কিনা।
সিনট্যাক্স
Autofocus প্রোপার্টি সেট করার সিনট্যাক্স:
rangeObject.autofocus = true|false
এখানে, true মানে রেঞ্জ স্লাইডার ফোকাস পাবে এবং false মানে অন্যথা। ডিফল্টভাবে false সেট করা থাকে।
উদাহরণ
Input range autofocus প্রোপার্টির জন্য একটি উদাহরণ:
<!DOCTYPE html> <html> <body> <h1>Input range autofocus property</h1> <form> <input type="range" id="RANGE1" name="VOL" autofocus> </form> <br> <button type="button" onclick="rangeFocus()">CHECK</button> <p id="Sample"></p> <script> function rangeFocus() { var R = document.getElementById("RANGE1").autofocus; document.getElementById("Sample").innerHTML = "The autofocus property is set to: "+R; } </script> </body> </html>
আউটপুট
এটি নিচের আউটপুট তৈরি করবে:
CHECK বাটনে ক্লিক করার পর:
উদাহরণের ব্যাখ্যা
- আমরা একটি ইনপুট ফিল্ড তৈরি করেছি একটি ফর্মের ভেতরে যার type="range", id="RANGE1", name="VOL" এবং এর autofocus প্রোপার্টি সক্রিয় আছে অর্থাৎ true সেট করা আছে।
- তারপর একটি CHECK বাটন তৈরি করা হয়েছে যা ক্লিক করলে rangeFocus() মেথড এক্সিকিউট হবে।
- rangeFocus() মেথড getElementById() ব্যবহার করে type="range" ইনপুট এলিমেন্ট পায় এবং autofocus প্রোপার্টি পায়। Autofocus প্রোপার্টি true এবং false রিটার্ন করে রেঞ্জ স্লাইডারের autofocus অ্যাট্রিবিউটের মানের উপর ভিত্তি করে। এই মান R ভেরিয়েবলে অ্যাসাইন করা হয় এবং "Sample" id वाले প্যারাগ্রাফে innerHTML প্রোপার্টি ব্যবহার করে প্রদর্শন করা হয়।
