Làm cách nào để chọn một nút radio theo mặc định?
Theo mặc định “ đã kiểm tra ” thuộc tính được sử dụng để chọn nút radio. Nếu thuộc tính này được sử dụng trên nhiều nút radio thì nút radio gần đây nhất sẽ được chọn theo mặc định. Thực hiện theo blog từng bước để chọn nút radio theo mặc định:
Bước 1: Tạo các nút radio
Trong tệp HTML, tạo ba nút radio và đính kèm nhãn với chúng:
< trung tâm >
< h3 > Chọn cấp độ kinh nghiệm của bạn: < / h3 >
< div >
< đầu vào kiểu = 'Đài' nhận dạng = 'người bắt đầu' tên = 'kinh nghiệm' giá trị = 'người bắt đầu' >
< nhãn vì = 'người bắt đầu' > Người bắt đầu < / nhãn >
< / div >
< div >
< đầu vào kiểu = 'Đài' nhận dạng = 'trung cấp' tên = 'kinh nghiệm' giá trị = 'trung cấp' >
< nhãn vì = 'trung cấp' > Trung cấp < / nhãn >
< / div >
< div >
< đầu vào kiểu = 'Đài' nhận dạng = 'nâng cao' tên = 'kinh nghiệm' giá trị = 'nâng cao' >
< nhãn vì = 'nâng cao' > Nâng cao < / nhãn >
< / div >
< / trung tâm >
Trong đoạn mã trên:
- Nút radio được hình thành bằng cách tạo đơn giản “ <đầu vào> ” thẻ và đặt loại của nó thành “ Đài ”.
- Gán từng nút radio với “tên”, “id” và “giá trị”.
- Cuối cùng, hãy sử dụng “ nhận dạng ” của trường nhập liệu để đính kèm “
” gắn thẻ bằng cách sử dụng “ vì ' thuộc tính.
Sau khi thực thi đoạn script, đầu ra như sau:
Hình này thể hiện rằng các nút radio được hiển thị nhưng không có nút nào được chọn theo mặc định.
Bước 2: Chọn Theo mặc định
Các ' đã kiểm tra ” thuộc tính được sử dụng để tự động chọn nút radio. Nó chỉ chọn một tùy chọn. Đó là lý do tại sao cách tốt hơn là chọn một nút radio theo mặc định. Nó hạn chế người dùng chọn tùy chọn phù hợp:
< div >
< đầu vào kiểu = 'Đài' nhận dạng = 'người bắt đầu' tên = 'kinh nghiệm' giá trị = 'người bắt đầu' đã kiểm tra>
< nhãn vì = 'người bắt đầu' >Người mới bắt đầu< / nhãn >
< / div >
Trong đoạn mã trên, đã kiểm tra thuộc tính được sử dụng và nó chỉ được gán cho trường đầu vào đầu tiên.
Bây giờ sau khi thực thi đoạn mã trên, trang web trông như thế này:
Đầu ra minh họa rằng nút radio đầu tiên được chọn theo mặc định trên mỗi lần làm mới trang.
Mẹo bổ sung: Sử dụng JavaScript để chọn nút radio theo mặc định
Để chọn nút radio theo mặc định bằng JavaScript, hãy truy cập nút radio bằng id. Sau đó, chọn thuộc tính đã kiểm tra của nó và đặt giá trị Boolean của nó thành “true” như trong đoạn mã dưới đây:
< kịch bản >tài liệu.getElementById ( 'người bắt đầu' ) . đã kiểm tra = ĐÚNG VẬY;
< / kịch bản >
Trong mã này, ' người bắt đầu ” là id của nút radio được chọn theo mặc định.
Sau khi biên dịch tập lệnh, đầu ra như sau:
Trong ảnh chụp nhanh ở trên, nút radio đầu tiên được chọn theo mặc định bằng JavaScript.
Phần kết luận
Để chọn một nút radio, người dùng có thể sử dụng “ đã kiểm tra ' thuộc tính. Nếu thuộc tính đã kiểm tra được sử dụng trong nhiều nút radio, thì nút radio đó sẽ nhận được giá trị thuộc tính 'đã kiểm tra' gần đây nhất. Để chọn nút radio theo mặc định bằng JavaScript, hãy truy cập nút radio bằng id. Blog này đã trình bày thành công cách chọn nút radio theo mặc định.