如果选中复选框，则隐藏复选框

Question

我有一个laravel刀片，我正在使用复选框更新DB值。我希望如果用户选中该复选框，它应该在单击时隐藏或禁用，但什么都不起作用。我犯了什么错误？或者我应该试试其他方法？

$(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>

Answer 1

使用属性"禁用"；。

$(document).ready(function() {
$('#checkbox1').click(function() {
$(this).attr("disabled", true);
});
});

Codepen