کاربرد دکمه‌های HTML با نوع input type="button"
در طراحی وب، دکمه‌ها نقش حیاتی در تعامل کاربران با صفحات وب ایفا می‌کنند. یکی از روش‌های ایجاد دکمه در HTML استفاده از تگ <input> با مقدار type="button" است که ویژگی‌های منحصر به فردی را ارائه می‌دهد.
مقایسه با سایر انواع دکمه‌ها
| نوع دکمه |
کاربرد اصلی |
مثال |
| type="button" |
دکمه‌های عمومی با عملکرد سفارشی |
<input type="button" value="کلیک کنید"> |
| type="submit" |
ارسال فرم‌ها |
<input type="submit" value="ارسال"> |
| type="reset" |
بازنشانی فرم‌ها |
<input type="reset" value="پاک کردن"> |
تفاوت اصلی دکمه‌های نوع button با submit و reset در این است که این دکمه‌ها به‌صورت پیش‌فرض هیچ عملکرد خاصی ندارند و نیاز به کدنویسی JavaScript برای تعریف رفتار آنها وجود دارد.
ویژگی‌های کلیدی
- value: تعیین متن نمایشی روی دکمه
- onclick: تعریف عملکرد هنگام کلیک
- disabled: غیرفعال کردن دکمه
- class/id: استایل‌دهی با CSS
مثال کاربردی: <input type="button" value="نمایش پیام" onclick="alert('سلام!')" style="background:#2ecc71; color:white; border:none; padding:8px 15px;">
مزایای استفاده از input type="button"
- سازگاری بالا با تمام مرورگرها
- انعطاف‌پذیری در استایل‌دهی با CSS
- امکان تعریف عملکردهای پیچیده با JavaScript
- سادگی در پیاده‌سازی
برای اطلاعات بیشتر درباره ویژگی‌های این نوع دکمه می‌توانید input Type button تا مستندات کامل را مطالعه کنید.
توجه: در HTML5 تگ <button> نیز معرفی شده که انعطاف‌پذیری بیشتری در محتوای داخلی دارد، اما input type="button" همچنان در بسیاری از پروژه‌ها ترجیح داده می‌شود.
