点击动态控件的数据表

Question

我有一个 jquery 数据表，我从更改事件的下拉列表中填充该数据表。我在数据表中有两个复选框，我在复选框上运行 onclick。但是在第一次单击时，jquery 不会触发，只有当我第二次单击它时 jquery 才会触发，也会发生在切换页面上。我为点击添加了 .on()，因为我研究并看到动态控件可以工作那样。我还缺少什么让这个点击功能在第一次点击时起作用吗？下面是我的一些代码。

data table click on check box control no jquery click event on first click

data table click on check box control on second click

      $('#my-table').on('click', function () {
    var i = -1;
    $("input[id*='secondary']:checkbox").on("click", function () {

        if ($(this).is(':checked')) {
            i = selectedIds.indexOf($(this).val());
            if (i === -1) {
                selectedIds.push($(this).val());
            }

            CheckedSecondary(this);
        }
        else {
            jQuery(this).closest("tr").css("background-color", "");

            if (selectedIds.length > 0) {
                i = selectedIds.indexOf($(this).val());
                if (i != -1) {
                    selectedIds.splice(i, 1);
                }
            }
            if (!primaryChecked)
                $(this).closest('tr').find('input[type="checkbox"]').not(this).attr('disabled', false);
        }

    });

    $("#my-table").find("input[id*='primary']:checkbox").on("click", function () {
        if ($(this).is(':checked')) {
            primaryChecked = true;
            primaryID = this.value;

            CheckedPrimary(this);
        }
        else {
            primaryID = "";
            primaryChecked = false;
            $(this).closest('tr').find('input[type="checkbox"]').not(this).attr('disabled', false);

            $('input:checkbox[id^="primary"]').each(function () {

                if (!$(this).closest('tr').find('input[type="checkbox"]').is(':checked'))
                    $(this).attr('disabled', false);
            });
            jQuery(this).closest("tr").css("background-color", "");
        }

    });



});

Answer 1

您将单击处理程序附加到另一个没有意义的单击处理程序中。

删除首次点击处理程序：

$('#my-table').on('click', function () {

});

将点击处理程序附加到复选框，如下所示：

$('#my-table').on('click', "input[id*='secondary']:checkbox", function () {

});

和

$('#my-table').on('click', "input[id*='primary']:checkbox", function () {

});