How to Allow Only One Checkbox to be Checked using jQuery

Generally, we use radio buttons to let a user select ONE option from a limited number of choices. Most of the cases radio buttons are ideal to select a single option from a group of the options. But sometimes you required to use the checkbox to do the same functionality like a radio button. If you want to allow the user to check only one checkbox from a group of the checkboxes, it can be done easily using jQuery.

How to Allow Only One Checkbox to be Checked using jQuery

At first, include the jQuery library.

?

1	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

Use the following code to allow only one checkbox to be checked using jQuery.

HTML

?

1 2 3

<input name="skill" type="checkbox" value="male"> Male <input name="skill" type="checkbox" value="female"> Female <input name="skill" type="checkbox" value="other"> Other

JavaScript

?

1 2 3 4 5

$(document).ready(function(){     $('input:checkbox').click(function() {         $('input:checkbox').not(this).prop('checked', false);     }); });