How to Check and Respond to Checkbox State Changes Using jQuery?

How to Check Checkbox State Using jQuery

To check the checked property of a checkbox in jQuery and perform an action accordingly, the following steps can be followed:

Customizing HTML:

• Include the jQuery script in your HTML:
• Create a checkbox with an ID:
• Create an element to show or hide based on the checkbox state, with an ID:

jQuery Event Handling:

• Using JavaScript DOM:

  • Get the checkbox DOM element by ID: document.getElementById('isAgeSelected')

  • Check the checked property and perform corresponding actions:

    if (document.getElementById('isAgeSelected').checked) {
      $("#txtAge").show();
    } else {
      $("#txtAge").hide();
    }

    Copy after login

• Using jQuery:

  • Select the checkbox by ID: $('#isAgeSelected')

  • Use the click event to toggle the visibility of the txtAge element based on the checkbox state:

    $('#isAgeSelected').click(function() {
      $("#txtAge").toggle(this.checked);
    });

    Copy after login

The above is the detailed content of How to Check and Respond to Checkbox State Changes Using jQuery?. For more information, please follow other related articles on the PHP Chinese website!