当没有TR和TABLE变为隐藏时取消标记复选框

时间:2014-10-23 19:26:02

标签: javascript jquery html checkbox

我正在使用此功能删除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>

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

1 个答案:

答案 0 :(得分:0)

我刚刚使用<button id="btnEliminarNorma">Uncheck</button>添加Fiddle来删除复选标记并调整function eliminarMarcados()中的第一种方法:

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