HTML DOM ইনপুট নম্বর অবজেক্ট <ইনপুট<এলিমেন্টকে type=”number” সহ প্রতিনিধিত্ব করে।
আসুন দেখি কিভাবে ইনপুট নম্বর অবজেক্ট তৈরি করতে হয়
সিনট্যাক্স
নিচের সিনট্যাক্স −
var numberInput = document.createElement(“INPUT”); numberInput.setAttribute(“type”,”number”);
সম্পত্তি
নিচে ইনপুট নম্বর অবজেক্ট-
এর বৈশিষ্ট্য রয়েছে| সম্পত্তি | <থ>ব্যাখ্যা |
|---|---|
| স্বয়ংক্রিয়ভাবে সম্পূর্ণ | এটি সংখ্যা ইনপুট ক্ষেত্রের স্বয়ংসম্পূর্ণ বৈশিষ্ট্যের মান প্রদান করে এবং পরিবর্তন করে। |
| অটোফোকাস | এটি ফিরে আসে এবং পৃষ্ঠা লোড করার সময় ইনপুট নম্বর ক্ষেত্রটি ফোকাস করা উচিত কিনা তা পরিবর্তন করে। |
| নিষ্ক্রিয় | এটি ফিরে আসে এবং ইনপুট নম্বর ক্ষেত্রটি নিষ্ক্রিয় কিনা তা সংশোধন করে। |
| ডিফল্ট মান | এটি ইনপুট নম্বর ক্ষেত্রের ডিফল্ট মান প্রদান করে এবং পরিবর্তন করে। |
| ফর্ম | এটি ফর্মের রেফারেন্স প্রদান করে যেটিতে HTML নথিতে ইনপুট নম্বর ক্ষেত্র রয়েছে। |
| তালিকা | এটি ডেটালিস্টের রেফারেন্স প্রদান করে যাতে ইনপুট নম্বর ক্ষেত্র থাকে। |
| সর্বোচ্চ | এটি ইনপুট নম্বর ক্ষেত্রের সর্বোচ্চ বৈশিষ্ট্যের মান ফেরত দেয় এবং পরিবর্তন করে। |
| মিনিট | এটি ইনপুট নম্বর ক্ষেত্রের মিন অ্যাট্রিবিউটের মান ফেরত দেয় এবং পরিবর্তন করে। |
| নাম | এটি ইনপুট নম্বর ক্ষেত্রের নামের বৈশিষ্ট্যের মান প্রদান করে এবং পরিবর্তন করে। |
| শুধুমাত্র পঠন | এটি রিটার্ন করে এবং ইনপুট নম্বর ক্ষেত্রটি শুধুমাত্র পঠনযোগ্য কিনা তা সংশোধন করে। |
| প্রয়োজন | এটি ফেরত দেয় এবং ফর্মটি জমা দেওয়ার আগে নম্বর ক্ষেত্রটি অবশ্যই পূরণ করতে হবে কিনা তা সংশোধন করে৷ |
| ধাপ | এটি ইনপুট নম্বর ফিল্ডের সেট অ্যাট্রিবিউটের মান ফেরত দেয় এবং পরিবর্তন করে। |
| টাইপ | এটি সংখ্যা ইনপুট ক্ষেত্রের টাইপ অ্যাট্রিবিউটের মান প্রদান করে। |
| মান | এটি সংখ্যা ইনপুট ক্ষেত্রের মান বৈশিষ্ট্যের বিষয়বস্তু প্রদান করে এবং পরিবর্তন করে। |
| স্থানধারক | এটি সংখ্যা ইনপুট ক্ষেত্রের স্থানধারক বৈশিষ্ট্যের মান প্রদান করে এবং পরিবর্তন করে। |
পদ্ধতি
ইনপুট নম্বর অবজেক্ট
এর পদ্ধতিগুলি নীচে দেওয়া হল| পদ্ধতি | <থ>ব্যাখ্যা |
|---|---|
| স্টেপআপ() | এটি ইনপুট নম্বর ক্ষেত্রের মান তার প্যারামিটারে নির্দিষ্ট করা মান দ্বারা বৃদ্ধি করে। |
| পদক্ষেপ () | এটি ইনপুট নম্বর ক্ষেত্রের মান তার প্যারামিটারে নির্দিষ্ট করা মান দ্বারা হ্রাস করে। |
উদাহরণ
ইনপুট সংখ্যা বস্তুর একটি উদাহরণ দেখা যাক −
<!DOCTYPE html>
<html>
<style>
body{
text-align:center;
background-color:#363946;
color:#fff;
}
form{
margin:2.5rem auto;
}
button{
background-color:#db133a;
border:none;
cursor:pointer;
padding:8px 16px;
color:#fff;
border-radius:5px;
font-size:1.05rem;
outline:none;
}
.show{
font-weight:bold;
font-size:1.4rem;
}
</style>
<body>
<h1>form Property Demo</h1>
<form id="Form 1">
<fieldset>
<legend>Form 1</legend>
<input type="month" class="monthInput">
</fieldset>
</form>
<button onclick="identify()">Identify Month Input Field</button>
<p class="show"></p>
<script>
function identify() {
var formId = document.querySelector(".monthInput").form.id;
document.querySelector(".show").innerHTML = "Hi! I'm from " + formId;
}
</script>
</body>
</html> আউটপুট
এটি নিম্নলিখিত আউটপুট −
তৈরি করবে
“একটি ইনপুট নম্বর ক্ষেত্র তৈরি করুন-এ ক্লিক করুন একটি নম্বর ইনপুট ক্ষেত্র তৈরি করতে ” বোতাম৷
৷
