Jquery 复选框单击时数据表调用功能不起作用

Question

我有以下数据表脚本在工作。单击复选框时，我需要激活其他脚本函数。这不起作用，有人知道我做错了什么吗？我检查了控制台，没有发送 post，也没有错误日志。

数据表脚本

<script type="text/javascript">
    var checkCol = 4; //checkbox column
    $(document).ready(function () {
        $('#accountTable').dataTable({
            rowId: 'id',
            "processing": true,
            select: true,
            "ajax": "selectdatatable_allacc.php",
            "columns": [
                {
                    data: 'name'
                },
                {
                    data: 'email'
                },
                {
                    data: 'password'
                },
                {
                    data: 'rang'
                },
                {
                    data: 'do_lead'
                },
                {
                    data: 'notes',
                    render: function (data, type, row, meta) {
                        return '<font color=' + row.cat_color + '>' + data + '</font>';
                    }
                },
                {
                    'data': null,
                    title: 'Dead',
                    wrap: true,
                    "render": function (item) {
                        return '<input type="submit" value="Dead" style="width:57px !important;" class="example_e" onClick="mobreset(' +
                            item.id + ') "/>'
                    }
                },
                {
                    'data': null,
                    title: 'Login',
                    wrap: true,
                    "render": function (item) {
                        return '<input type="submit" value="Login" style="width:57px !important;" class="example_e" onClick="mobLogin(' +
                            item.id + ') "/>'
                    }
                },
                {
                    'data': null,
                    title: 'Action 2',
                    wrap: true,
                    "render": function (item) {
                        return '<input type="button" value=" Edit " id= ' + item.id +
                            ' style="width:57px !important;" class="example_c edit_data" />'
                    }
                },
            ],
            columnDefs: [{
                    targets: [checkCol],
                    render: function (data, type, row) {
                        if (type ===
                            'display') { //if column data is 1 then set attr to checked, use row id as input id (plus prefix)
                            return '<input type="checkbox" ' + ((data == 1) ? 'checked' : '') +
                                ' value="' + row.id + '" class="active" />';
                        }
                        return data;
                    },
                    className: "dt-body-center"
                },
                {
                    targets: 0,
                    className: "dt-body-center"
                },

            ],
            select: {
                style: 'os',
                selector: 'td:not(:nth-child(2))'
            },
        });
    });
</script>

选中或取消选中复选框时调用的脚本

<script type="text/javascript">
    $(document).ready(function () {
        $("input.active").click(function () {
            // store the values from the form checkbox, then send via ajax below
            var check_active = $(this).is(':checked') ? 1 : 0;
            var check_id = $(this).attr('value');

            $.ajax({
                type: "POST",
                url: "dolead.php",
                data: {
                    id: check_id,
                    active: check_active
                },

            });
            return true;
        });

    });
</script>

Answer 1

你可以尝试 jquery on 函数来完成工作

<script type="text/javascript">
    $(document).ready(function () {
        $("#accountTable").on("click", "input.active", function () { // notice the on function
            // store the values from the form checkbox, then send via ajax below

            console.log("checkbox clicked"); // to check if the event is working

            var check_active = $(this).is(':checked') ? 1 : 0;
            var check_id = $(this).attr('value');

            $.ajax({
                type: "POST",
                url: "dolead.php",
                data: {
                    id: check_id,
                    active: check_active
                },

            });
            return true;
        });

    });
</script>

Jquery 复选框单击时数据表调用功能不起作用

Jquery and Datatables call function on checkbox click is not working

jquery

datatables-1.10