Mục lục:
Video: Học HTML cơ bản bài 21: Web Form: Radio box, Checkbox & Textarea 2025
Để bao gồm các nút radio trên trang web HTML5 của bạn, nó giúp bạn biết chúng là gì và cách sử dụng chúng. Trên bề mặt, các nút radio có vẻ giống như các hộp kiểm nhưng khác với một số cách quan trọng:
-
Các nút radio chỉ xuất hiện theo nhóm. Bạn có thể có một hộp kiểm trên một biểu mẫu, nhưng nút radio chỉ có ý nghĩa khi được đặt trong các nhóm.
-
Chỉ có thể chọn một phần tử. Chọn một nút vô tuyến bỏ chọn những nút khác. Nó giống như một đài phát thanh xe hơi, nơi nhấp vào một trong các nút cài sẵn sẽ bỏ chọn những người khác. (Nó thực sự giống như các radio xe hơi cũ, nơi mà nếu nút bấm cho các trạm đã chọn đã được đẩy vào cơ thể, các nút khác sẽ bật lên.. Mặc dù loại đài phát thanh đã biến mất từ lâu, tên vẫn tồn tại)
-
id của mỗi nút radio là duy nhất. Mỗi id trên một trang web phải là duy nhất, và các phần tử id của mỗi nút radio tuân theo các quy tắc đó.
-
Mỗi phần tử vô tuyến cũng có thuộc tính tên . Thuộc tính name được sử dụng để chỉ định toàn bộ nhóm các vật thể vô tuyến.
-
Tất cả nút radio trong một nhóm có cùng tên. HTML sử dụng thuộc tính name để tìm ra nút radio nào nhóm, và để đảm bảo rằng chỉ một nút trong một nhóm được chọn.
Tham khảo đoạn mã sau để xem thiết lập cho trang web với các nút:
formDemo. html
Hình thức DemoChọn phần tử
Các nút radio nhỏ vừa phảiĐể tạo một nhóm các nút radio, hãy làm theo các bước sau:
-
để làm nền tảng cơ bản. Đặt loại
-
đến radio . Cho mỗi nút radio một id duy nhất
-
. Sử dụng thuộc tính
-
name để xác định tất cả các nút trong một nhóm. Xem xét nhóm hình ảnh là tốt.
-
Người dùng sẽ không thể cho biết nút nào là một phần của nhóm bằng cách định dạng HTML một mình. Bạn có thể sử dụng các lĩnh vực hoặc thủ thuật định dạng khác để giúp người dùng biết nút nào trong nhóm đó. Tất cả các nút trong một nhóm nên gần nhau về thể chất.
Chọn một trong các nút đã chọn (đã chọn) theo mặc định.
-
Áp dụng thuộc tính checked = "checked" (do bộ phận thừa nhận cung cấp) cho một trong các phần tử để nó bắt đầu kiểm tra.
Nếu bạn không chọn một nút radio, bất kỳ chương trình nào kèm theo biểu mẫu của bạn sẽ bị lẫn lộn.
