آموزش زبان HTML (جلسه ۵۶)

استفاده از range در تگ input برای انتخاب طیفی از اعداد در فرم های اچ تی ام ال (HTML)

اگر بخواهیم این امکان را برای کاربران فراهم آوریم که بتوانند طیفی از اعداد را در فرم های اچ تی ام ال (HTML) انتخاب کنند می بایست از مقدار range برای type استفاده کنیم. برای روشن شدن این موضوع کد زیر را وارد ویرایشگر متن خود می کنیم:

<!DOCTYPE html>
<html>
     
    <head>
        <meta charset="utf-8">
        <title>asrefonon</title>
    </head>
     
    <body>
        <form action="send-form-information.php" method="post">
            <input type="range" name="temperature">
        </form>
    </body>
</html>

حال به اجرای این فایل در مرورگر می پردازیم:

می بینیم که یک اسلایدر روی صفحه قرار گرفته است. اگر اسلایدر را به منتها الیه سمت چپ بکشیم عدد صفر را انتخاب کرده ایم و اگر اسلایدر را به منتها الیه سمت راست بکشیم عدد صد را انتخاب کرده ایم. علاوه بر این می توان مقدار حداقل و حداکثر نیز برای این اسلایدر به صورت زیر در نظر گرفت:

   <body>
       <form action="send-form-information.php" method="post">
           <input type="range" name="temperature" min="0" max="70">
       </form>
   </body>

می بینیم که با Attribute هایی از جنس min و max می توان مقادیر حداقل و حداکثری برای اسلایدر خود در نظر بگیریم.

221

اسماعیلی هستم مدیر عصر فنون. فارغ التحصیل مقطع کارشناسی ارشد رشته مهندسی فناوری اطلاعات (IT)