当不再有TR并且TABLE隐藏时,取消标记复选框

Unmark checkbox when there is no more TR and TABLE goes hide

本文关键字:取消 复选框 隐藏 不再 TR 并且 TABLE      更新时间:2023-09-26

我正在使用这个函数来删除selector容器元素中任何标记的复选框。代码运行良好,但有一个小问题:我无法取消选中第一个复选框(切换selector2容器中所有复选框的复选框)。现在这是删除选中复选框的代码:

function eliminarMarcados(selector, toggleMsg, msgSelector) {
    $(selector + " input[type='checkbox']:checked").closest("tr").not('.tableHead').remove();
    if (toggleMsg) {
        if ($(selector + " tbody tr").length == 0) {
            $(msgSelector).show();
            $(selector).hide();
            // 1st test didn't work since it's not right
            //$(selector + " tr").hasClass('tableHead').$(selector + " input[type='checkbox']").prop('checked', false);
        }
    }
}

我就是这样称呼它的:

$("#btnEliminarNorma").on('click', function () {
    eliminarMarcados("#tablaNorma", true, "#alertSinNorma");
});

这是我用来切换选中的所有复选框的代码:

function marcarTodosCheck(selChk, tableBody) {
    $(selChk).on('click', function () {
        var $toggle = $(this).is(':checked');
        $(tableBody).find("input:checkbox").prop("checked", $toggle).trigger("change");
    });
    $(tableBody).find("input:checkbox").on('click', function () {
        if (!$(this).is(':checked')) {
            $(selChk).prop("checked", false).trigger("change");
        } else if ($(tableBody).find("input:checkbox").length == $(tableBody).find("input:checkbox:checked").length) {
            $(selChk).prop("checked", true).trigger("change");
        }
    });
}

我这样称呼它:

marcarTodosCheck("#toggleCheckNorma", "#tablaNorma");

这就是它背后的HTML代码:

<table class="table table-condensed" id="tablaNorma">
    <thead>
        <tr class="tableHead">
            <th><input type="checkbox" id="toggleCheckNorma" name="toggleCheckNorma"></th>
            <th>Nro.</th>
            <th>Norma COVENIN</th>
            <th>Año de Publicación</th>
            <th>Comité Técnico</th>
        </tr>
    </thead>
    <tbody id="normaBody">
        <tr class="">
            <td><input type="checkbox" value="5"></td>
            <td>382</td><td>Sit alias sit.</td>
            <td>1970</td><td>Velit eum.</td>
        </tr>
        <tr class="">
            <td><input type="checkbox" value="6"></td>
            <td>38362</td>
            <td>Et voluptatem.</td><td>1976</td>
            <td>Et voluptatem.</td>
        </tr>
    </tbody>
</table>

如何取消标记第一个复选框?

我刚刚用一个额外的<button id="btnEliminarNorma">Uncheck</button>做了一个Fiddle,以删除复选标记并调整function eliminarMarcados():中的第一个方法

$(selector).find(" input[type='checkbox']").prop('checked', false);