Question

我在td上使用复选框列表附加事件时出现问题，我使用列过滤器插件，所以问题是事件只附加在第一页上，所以我使用fnDrawCallback将事件附加到复选框上数据表，问题是当我两次拼写或我写ab时它会将事件附加两次。因此复选框不起作用。这是我使用的javascript代码：

$(document).ready(function () {
    $('#example').dataTable({
        "fnDrawCallback": function (oSettings) {
            $("[id*='UsertmpCheckbox']").on('change', function () {
                //alert(parseInt($(this).attr('id').replace(/[^0-9\.]/g, '')));
                var checkboxid = '#UserCheckbox' + parseInt($(this).attr('id').replace(/[^0-9\.]/g, ''));
                alert(checkboxid);
                if ($(checkboxid).prop('checked') == false) {
                    $(checkboxid).prop('checked', true);
                } else {
                    $(checkboxid).prop('checked', false);
                }
            });
        }
    }).columnFilter({ /*sPlaceHolder: "head:after",*/
        aoColumns: [{
            type: "checkbox",
            values: null /*[ 'Gecko', 'Trident', 'KHTML', 'Misc', 'Presto', 'Tasman', 'Webkit']*/
        }, {}, {}, {}, {
            type: "checkbox",
            values: ['A', 'B', 'C', 'U', 'X']
        }]
    });
});

附加事件的函数在fnDrawCallback回调中。

提前致谢

Answer 1

答案： -

$(document).ready( function () {
            $('#example').dataTable( {

                "fnDrawCallback": function( oSettings ) {
                    $("[id*='UsertmpCheckbox']").off('click');
                    $("[id*='UsertmpCheckbox']").on('click',function() {
                        //alert(parseInt($(this).attr('id').replace(/[^0-9\.]/g, '')));
                        var checkboxid = '#UserCheckbox'+parseInt($(this).attr('id').replace(/[^0-9\.]/g, ''));
                        alert(checkboxid);
                        if($(checkboxid).prop('checked')==false){
                            $(checkboxid).prop('checked', true);
                        }
                        else{
                            $(checkboxid).prop('checked', false);
                        }

                    });

                }
            } ).columnFilter({ /*sPlaceHolder: "head:after",*/ aoColumns: [
          {  type: "checkbox", values: null /*[ 'Gecko', 'Trident', 'KHTML', 'Misc', 'Presto', 'Tasman', 'Webkit']*/ },{},{},{},{ type: "checkbox", values: [ 'A', 'B', 'C', 'U', 'X']  } ]});
        } );

jquery和datatable附加事件问题

1 个答案: