How to make checkbox behave like radio button in jQuery?

Make checkbox behave like radio button in jQuery:
Use below snippet to make checkbox to behave like a radio button. if you want to make a perfect radio button of checkbox then use example1 of below examples.

Example1-

<!doctype html>

<html lang="en">

<head>

  <meta charset="utf-8">

  <meta name="viewport" content="width=device-width, initial-scale=1">

  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>

</head>

<body>

  <label><input type="checkbox" name="cbx1" class="ans" /> Answer1</label>

  <label><input type="checkbox" name="cbx2" class="ans" /> Answer2</label>

  <label><input type="checkbox" name="cbx3" class="ans" /> Answer3</label>

  <label><input type="checkbox" name="cbx4" class="ans" /> Answer4</label>

  <script type="text/javascript">

  $(function () {

      $(".ans").click(function() { //you can also use change Function instead of click

        $(".ans").prop('checked', false);

        $(this).prop('checked', true);

      });

  });

  </script>

</body>

</html>

Output:


Example2-

<!doctype html>

<html lang="en">

<head>

  <meta charset="utf-8">

  <meta name="viewport" content="width=device-width, initial-scale=1">

  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>

</head>

<body>

  <label><input type="checkbox" name="cbx1" class="ans" /> Answer1</label>

  <label><input type="checkbox" name="cbx2" class="ans" /> Answer2</label>

  <label><input type="checkbox" name="cbx3" class="ans" /> Answer3</label>

  <label><input type="checkbox" name="cbx4" class="ans" /> Answer4</label>

  <script type="text/javascript">

    $(function () {

      $(".ans").change(function () { //You can also use click method

        $(".ans").not(this).prop('checked', false);

      }); // You must need to use

    });

  </script>

</body>

</html>

Output: