انتقل إلى محتوى الدرس

Checkbox Inputs for Multiple Selection مربعات الاختيار المتعدد Checkbox

تعلم الحقول الاختيارية في نماذج HTML: اكتشف كيفية بناء أزرار الاختيار الأحادي Radio، ومربعات التحديد Checkbox، وشرائط التمرير Range، ومنتقي الألوان Color باحترافية.
4 صفوف تعليمية
لغة HTML
7,042 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي
تتيح مربعات الاختيار <input type="checkbox"> جمع حالات ثنائية مستقلة لكل خيار. وخلافاً لأزرار الراديو، تسمح مربعات التحديد باختيار عدة عناصر معاً أو تركها جميعاً دون قيود تنافية.
الصف 2 كود برمجي
HTML
<!-- Independent add-on services selection -->
<form action="/services" method="post">
  <input id="srv-bk" name="addons"
         type="checkbox" value="backup" checked>
  <label for="srv-bk">Automated Daily Backup</label>

  <input id="srv-sec" name="addons"
         type="checkbox" value="security">
  <label for="srv-sec">Realtime Threat Firewall</label>
  <button type="submit">Save Services</button>
</form>
الصف 3 شرح توضيحي
وجه المقارنة أزرار الاختيار الأحادي Radio مربعات الاختيار المتعدد Checkbox
نموذج التحديد اختيار بديل واحد فقط من المجموعة اختيار متعدد حر أو عدم اختيار أي عنصر
خاصية الاسم name يجب أن تكون متطابقة لربط المجموعة يمكن أن تشترك أو تنفرد بأسماء مستقلة
إلغاء التحديد لا يمكن إلغاؤه بالنقر على نفس الزر مجدداً يمكن تفعيله وإلغاؤه بحرية بالنقر المتكرر
حزمة الإرسال تُرسل قيمة واحدة فقط تمثل الخيار النشط تُرسل المربعات المفعلة فقط وتُهمل غير المحددة
المظهر الهندسي دوائر بنقطة داخلية مركزية مربعات بعلامة تحقق دلالية
الصف 4 ملاحظة هامة