不是选择器(不确定我是否做得正确）

我做这件事已经几天了，似乎找不到正确的方法。我想要的是，当用户取消选中复选框时，它应该提交复选框的Id，然后将其删除到表中。

//JS-

<script>
$(document).ready(function(){
    $('#list-tbl tr').each(function(){
        var $this = $(this);
        var ID = $(this).attr("id").replace("tr","");
        var user_id = $('#user_id').val();
        var read = $('#read'+ID).val();
        var add = $('#add'+ID).val();
        var approve = $('#approve'+ID).val();
        $('input[type=checkbox]', $this).change(function(){
            if($('.read'+ID, $this).is(':checked')){
                $('input[type=checkbox]', $this).prop('disabled',true);
                 $.ajax({
                    type: "POST",
                    url: "<?= base_url('admin/update/read')?>",
                    data: "read="+ read + "&user_id=" + user_id,
                    success: function(){
                        $('form#submit').hide();
                            alert("Permission added");
                        $('div.success').fadeIn();   
                    }
                });
                $(this).prop('disabled',false);
            } else if($('.add'+ID, $this).is(':unchecked')) {
                $('.read', $this).prop('disabled', true);
                $.ajax({
                   alert("FU");  
                    }
                });
                $(this).prop('disabled', false);
            } else if($('.add'+ID, $this).is(':checked')) {
                $('.read', $this).prop('disabled', true);
                $.ajax({
                    type: "POST",
                    url: "<?= base_url('admin/update/add')?>",
                    data: "add="+ add + "&user_id=" + user_id,
                    success: function(){
                        $('form#submit').hide();
                            alert("Permission add added");
                        $('div.success').fadeIn();   
                    }
                });
                $(this).prop('disabled', false);
            } else if($('.approve'+ID, $this).is(':checked')) {
                $('.read', $this).prop('disabled', true);
                $.ajax({
                    type: "POST",
                    url: "<?= base_url('admin/update/approve')?>",
                    data: "approve="+ approve + "&user_id=" + user_id,
                    success: function(){
                        $('form#submit').hide();
                            alert("Permission approve added");
                        $('div.success').fadeIn();   
                    }
                });
                $(this).prop('disabled', false);
            }
            else{
                $('input[type=checkbox]', $this).prop('disabled',false);
                $(this).prop('disabled',false);
            }
        });
    });
});

我还想把复选框初始化为它们应该是的样子。规则是。

当用户具有读取权限时（应禁用添加和批准）。当用户具有添加/批准权限时（应禁用只读）。

在我的jQuery脚本上，它已经工作了，但如果它被重新加载触发，它就不会工作。。

HTML:

<table width="100%" id="list-tbl"><form id="permissions2"><tr id="tr2"><td>Sia Olsen</td><td align="right"><input type="hidden" name="user_id" id="user_id" value="2" />Read&nbsp;&nbsp;&nbsp;<input type="checkbox" name="read2" id="read2" class="read2" checked />Add&nbsp;&nbsp;&nbsp;<input type="checkbox" name="add2" id="add2" class="add2" checked />Approve&nbsp;&nbsp;&nbsp;<input type="checkbox" name="approve2" id="approve2" class="approve2" checked /></td></tr></form><form id="permissions3"><tr id="tr3"><td>Mary Lee</td><td align="right"><input type="hidden" name="user_id" id="user_id" value="3" />Read&nbsp;&nbsp;&nbsp;<input type="checkbox" name="read3" id="read3" class="read3" checked />Add&nbsp;&nbsp;&nbsp;<input type="checkbox" name="add3" id="add3" class="add3"  />Approve&nbsp;&nbsp;&nbsp;<input type="checkbox" name="approve3" id="approve3" class="approve3"  /></td></tr></form></table>
</div></div>