我有laravel刀片，我正在更新一个DB值使用复选框。我想如果一个用户勾选该复选框，它应该是隐藏在单击或禁用，但没有任何工作。我犯了什么错误？或者我应该试试别的方法？

null

$(document).ready(function() {
  $(document).on('change', '.js-switch', function() {
    let received_amount = $(this).prop('checked') === true ? 1 : 0;
    if ($(this).prop('checked') == 0) {
      $(this).closest('tr').addClass('cancel');
    } else {
      $(this).closest('tr').removeClass('cancel');
    }
    let userId = $(this).data('id');
    $.ajax({
      type: "GET",
      dataType: "json",
      url: "url",
      data: {
        'received_amount': received_amount,
        'user_id': userId
      },
      success: function(data) {
        console.log(data.message);
      }
    });
    $(".red").show();
    $(this).hide()
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span>Received Subtotal</span> <input type="checkbox" data-id="1" name="equal_order" value="red" class="red"></label>

null