24. مدخلات الاختيار: مربعات الاختيار (Checkboxes) وأزرار الراديو (Radio Buttons)
تسمح أنواع المدخلات هذه للمستخدمين بالاختيار من قائمة محددة مسبقاً من الخيارات.
24.1 مربعات الاختيار (type="checkbox")
تسمح مربعات الاختيار للمستخدم بتحديد صفر أو خيار واحد أو خيارات متعددة من قائمة.
html <input type="checkbox" id="news" name="subscription" value="newsletter"> <label for="news">الاشتراك في النشرة الإخبارية</label><br>
<input type="checkbox" id="promo" name="subscription" value="promotions"> <label for="promo">تلقي العروض الترويجية</label>24.2 أزرار الراديو (type="radio")
تسمح أزرار الراديو للمستخدم بتحديد خيار واحد فقط من قائمة خيارات حصرية متبادلة.
قاعدة حاسمة: يجب أن تشترك جميع أزرار الراديو في المجموعة في قيمة خاصية name ذاتها تماماً. هذه هي الطريقة التي يعرف بها المتصفح أنها تنتمي لبعضها البعض.
html
<p>طريقة الاتصال المفضلة:</p> <input type="radio" id="email" name="contact" value="email"> <label for="email">البريد الإلكتروني (Email)</label><br> <input type="radio" id="phone" name="contact" value="phone"> <label for="phone">الهاتف (Phone)</label>24.3 تحديد الخيارات مسبقاً
استخدم خاصية checked لجعل خيار ما محدداً افتراضياً.
html <input type="checkbox" name="remember_me" checked>