Cách kiểm tra/bỏ chọn hộp kiểm bằng JavaScript

Trong đoạn mã trên:

• Tạo một hộp kiểm, với id “ hộp kiểm ” sẽ được sử dụng để truy cập phần tử “ hộp kiểm ” để thực hiện các hành động.
• Tạo hai nút, “ Đúng ' và ' Không ”, để chọn hoặc bỏ chọn hộp kiểm sẽ kích hoạt chức năng “ kiểm tra() ' và ' bỏ chọn() ” tương ứng trên sự kiện nhấp chuột.

Sau khi thực thi đoạn mã trên, đầu ra sẽ như thế này:

Tiếp theo, xác định các chức năng để thực hiện các hành động trên hộp kiểm trong tệp JavaScript hoặc thẻ. Để chọn hộp kiểm, hãy sử dụng các dòng mã bên dưới:

Trong đoạn mã trên:

• Định nghĩa một chức năng “ kiểm tra() ” sẽ kích hoạt thao tác nhấp vào nút để chọn hộp kiểm.
• Bên trong phần thân của hàm, lấy tham chiếu của hộp kiểm bằng cách sử dụng id của nó “ hộp kiểm ” với sự giúp đỡ của “ getElementById() ” phương thức và lưu trữ nó trong một biến “ đầu vào ”.
• Chọn hộp kiểm bằng cách đặt “ đã kiểm tra ' tài sản ' thật ”.

Để bỏ chọn hộp kiểm bằng cách nhấp vào nút “ Không ”, hãy sử dụng mã được cung cấp bên dưới:

Đoạn mã trên:

• Định nghĩa một chức năng “ bỏ chọn() ” sẽ kích hoạt nhấp vào nút để bỏ chọn hộp kiểm.
• Bên trong phần thân của hàm, lấy tham chiếu của hộp kiểm bằng cách sử dụng id của nó “ hộp kiểm ” với sự giúp đỡ của “ getElementById() ” phương thức và lưu trữ nó trong một biến “ đầu vào ”.
• Bỏ chọn hộp kiểm bằng cách đặt “ đã kiểm tra ' tài sản ' sai ”.

Cuối cùng, xác định một chức năng để bỏ chọn hộp kiểm theo mặc định khi tải trang bằng cách sử dụng “ cửa sổ.onload ' Sự kiện:

đầu ra

Đầu ra biểu thị rằng hộp kiểm đã được chọn và bỏ chọn thành công khi nhấp vào các nút.

Ví dụ 2: Chọn/Bỏ chọn nhiều hộp kiểm
Hãy xem một ví dụ về cách chọn hoặc bỏ chọn tất cả các hộp kiểm cùng một lúc.

Đầu tiên, tạo một tệp HTML, sau đó tạo nhiều hộp kiểm và một nút có id “ chuyển đổi ” sẽ chuyển đổi hộp kiểm để kiểm tra hoặc bỏ chọn: