چک باکس در HTML (یا CheckBox)

نوامبر 29, 2023
ارسال توسط سعید غریبی

در توسعه وب، فرم‌ها یکی از ابزارهای اساسی برای جمع‌آوری اطلاعات از کاربران هستند. چک‌باکس یکی از عناصر مهم در فرم‌ها است که به کاربران این امکان را می‌دهد تا گزینه‌های مختلف را انتخاب یا علامت بزنند. در این مقاله، با چک باکس در HTML آشنا می‌شویم و نحوه استفاده از آن در فرم‌ها را بررسی می‌کنیم.

مفهوم چک باکس در HTML

چک‌باکس یک عنصر فرم است که به کاربر این امکان را می‌دهد تا یک گزینه را انتخاب یا از انتخاب خارج کند. این عنصر معمولاً با استفاده از تگ <input> و ویژگی type="checkbox" ایجاد می‌شود. چک‌باکس‌ها می‌توانند به صورت مستقل یا به همراه متن یا دیگر عناصر قرار گیرند.

نحوه استفاده از چک‌باکس HTML

<!DOCTYPE html>
<html lang="fa">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>مثال چک‌باکس HTML</title>
</head>
<body>

  <form action="/submit" method="post">
    <label for="option1">گزینه 1:</label>
    <input type="checkbox" id="option1" name="options[]" value="option1">
    <br>

    <label for="option2">گزینه 2:</label>
    <input type="checkbox" id="option2" name="options[]" value="option2">
    <br>

    <label for="option3">گزینه 3:</label>
    <input type="checkbox" id="option3" name="options[]" value="option3">
    <br>

    <input type="submit" value="ارسال">
  </form>

</body>
</html>

توضیحات نمونه کد

تگ <input> با ویژگی type="checkbox": این تگ برای ایجاد چک‌باکس استفاده می‌شود.
ویژگی id: هر چک‌باکس باید یک شناسه یکتا (id) داشته باشد که به تگ <label> متصل شود.
ویژگی name: این ویژگی مشخص می‌کند که چک‌باکس در فرم با چه نامی ارسال شود. در اینجا options[] به معنای یک آرایه از گزینه‌ها است.
ویژگی value: این ویژگی مقداری است که با انتخاب چک‌باکس ارسال می‌شود.
تگ <label>: این تگ برای نمایش متن مرتبط با چک‌باکس است. for به شناسه یکتای چک‌باکس اشاره می‌کند.

کاربردهای چک باکس در HTML

انتخاب گزینه‌ها در فرم‌ها: چک‌باکس‌ها برای انتخاب گزینه‌ها در فرم‌ها مانند انتخاب گزینه‌های ارسال فرم یا تنظیمات استفاده می‌شوند.
فیلتر و جستجو: در برخی از وبسایت‌ها، چک‌باکس‌ها برای فیلتر یا جستجو در محتواها استفاده می‌شوند.
تنظیمات کاربری: در صفحات تنظیمات کاربری، از چک‌باکس‌ها برای فعال یا غیرفعال کردن ویژگی‌ها یا اختیارات استفاده می‌شود.

نکات پایانی

استفاده از چک‌باکس HTML یکی از راه‌های موثر برای جمع‌آوری اطلاعات از کاربران در فرم‌ها است. با استفاده از این عنصر، کاربران می‌توانند یک یا چند گزینه را به راحتی انتخاب کنند. مراقب باشید که از نام‌ها و شناسه‌های یکتا برای هر چک‌باکس استفاده کنید تا فرم به درستی کار کند و اطلاعات به درستی ارسال شود