javascript - How to get value Check and Uncheck checkbox use JQuery on array

Solution:

I believe you can just do it like this if ($(this).prop('checked')) {

Then it will only check if the checkbox that you click on is checked or not.

Demo

$(function() {
  $('.dealprice').on('input', function() {

    if ($(this).prop('checked')) {
      //CHECKED
      console.log("Checked");
      const getPrice = $(this).closest("tr").find('input[name=itemprice]').val();
      console.log(getPrice);
    } else {
      //UNCHECKED
      console.log("Uncheck");
      const getPrice = $(this).closest("tr").find('input[name=itemprice]').val();
      console.log(getPrice);
    }

  });
});

.tg  {border-collapse:collapse;border-spacing:0;}
.tg td{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
  overflow:hidden;padding:10px 5px;word-break:normal;}
.tg th{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
  font-weight:normal;overflow:hidden;padding:10px 5px;word-break:normal;}
.tg .tg-qh0q{background-color:#c0c0c0;color:#000000;font-weight:bold;text-align:center;vertical-align:top}
.tg .tg-0lax{text-align:left;vertical-align:top}
.tg .tg-amwm{font-weight:bold;text-align:center;vertical-align:top}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="tg">
  <thead>
    <tr>
      <th class="tg-qh0q">Item</th>
      <th class="tg-qh0q">Price</th>
      <th class="tg-qh0q">Deal</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td class="tg-0lax">Book</td>
      <td class="tg-0lax">$ 10 <input type="hidden" name="itemprice" value="10"></td>
      <td class="tg-0lax"><input type="checkbox" class="dealprice" name="deal[12][0]"></td>
    </tr>
    <tr>
      <td class="tg-0lax">Pencil</td>
      <td class="tg-0lax">$ 5 <input type="hidden" name="itemprice" value="5"></td>
      <td class="tg-0lax"><input type="checkbox" class="dealprice" name="deal[12][1]"></td>
    </tr>
    <tr>
      <td class="tg-0lax">Pen</td>
      <td class="tg-0lax">$ 8 <input type="hidden" name="itemprice" value="8"></td>
      <td class="tg-0lax"><input type="checkbox" class="dealprice" name="deal[12][2]"></td>
    </tr>

    <tr>
      <td class="tg-0lax">spidol</td>
      <td class="tg-0lax">$ 15 <input type="hidden" name="itemprice" value="15"></td>
      <td class="tg-0lax"><input type="checkbox" class="dealprice" name="deal[12][3]"></td>
    </tr>
  </tbody>
</table>

Answer

Solution:

<script>
    $(document).ready(function(){
        $(".dealprice").change(function(){
            if($(this).is(":checked")){
                console.log(true);
            } else {
                console.log(false);
            }
        });
    });
</script>

Source