Làm thế nào để sử dụng hộp kiểm tra và nút radio trong mẫu HTML5 của bạn

Khi tạo mẫu thu thập dữ liệu cho trang web của bạn, nếu chỉ có một tập hợp các giá trị có thể có cho người dùng, bạn có thể cho anh ta bộ sưu tập các tùy chọn để lựa chọn:

• Hộp kiểm: Chọn nhiều hơn một lựa chọn.

• Các nút radio: Chỉ chọn một tùy chọn.

  Các nút radio khác với hộp kiểm theo một cách quan trọng: Người dùng có thể chọn một nút radio đơn từ một bộ các tùy chọn nhưng có thể chọn bất kỳ số hộp kiểm nào (kể cả không có, một hoặc nhiều hơn).

Nếu có nhiều lựa chọn (hơn một nửa tá), hãy sử dụng một danh sách thả xuống thay vì các nút radio hoặc hộp kiểm.

Để tạo các nút radio và hộp kiểm, thực hiện các bước sau:

1. Sử dụng phần tử với thuộc tính type được đặt thành radio hoặc hộp kiểm.

2. Tạo mỗi tùy chọn với các thuộc tính này:

   • tên: Cho tùy chọn một tên.

   • value: Xác định giá trị được trả lại nếu người dùng chọn tùy chọn.

Bạn cũng có thể sử dụng thuộc tính đã kiểm tra (với giá trị được đánh dấu) để xác định rằng một tùy chọn nên đã được chọn khi trình duyệt hiển thị biểu mẫu. Đây là một cách hay để chỉ định một lựa chọn mặc định.

Đánh dấu này cho thấy làm thế nào để định dạng hộp kiểm và nút tùy chọn nút radio:

Một số loại thực phẩm yêu thích của bạn là gì?

Pizza
Ice Cream
Trứng Xanh và Hầm







Giới tính của bạn là gì?

Nam
Nữ

Kết quả được thể hiện trong hình này.

Trong đánh dấu trước, mỗi bộ tùy chọn sử dụng cùng một tên cho mỗi điều khiển đầu vào nhưng cho một giá trị khác nhau cho mỗi tùy chọn. Bạn cho mỗi mục trong một bộ các tùy chọn cùng tên để cho trình duyệt biết rằng chúng là một phần của bộ.

Nếu bạn muốn, bạn có thể chọn nhiều hộp kiểm như bạn muốn mặc định trong đánh dấu trang - chỉ cần bao gồm checked = "checked" trong mỗi phần tử bạn muốn chọn trước.