js根据选中的复选框,隐藏那一行

如图,选择复选框,点击“隐藏”按钮,隐藏选中行

1、JavaScript代码:

    function getCheckedIds() {
            var checkedSubject = $('#showSbgl input[name=checkIds]:checkbox:checked');
            checkedSubject.each(function() {
                    $(this).parents("tr").hide();
            });
        }

 (1)checkedSubject :根据table表id:showSbgl ,获取选中的复选框id:input[name=checkIds]:checkbox:checked',最后把选中的复选框给checkedSubject 

 (2)checkedSubject.each(function(){}):遍历checkedSubject,

(3)$(this):每一个选中的复选框。

(4)$(this).parents("tr"),选中的复选框所在那一行,hide():隐藏

        <table id="showSbgl" >
                <thead>
                    <tr class="yogurt_tab_back" onmouseover="this.className='yogurt_tab_trhover'" onmouseout="this.className='yogurt_tab_back'">
                        <th width="3%"><input type="checkbox" name="sbglId" onClick="allchecked(this)"></th>
                        <th width="10%">设备名称</th>
                        <th width="10%">设备类型</th>
                    </tr>
                </thead>
                <tbody id="sbglTb">
                    <c:forEach var="sbgl" items="${resultMap.resultList}" varStatus="status">
                        <tr>
                            <td><input type="checkbox" id="checkIds" name="checkIds"></td>
                            <td>${sbgl.sbmc }</td>
                            <td>${sbgl.sblx }</td>
                        </tr>
                    </c:forEach>
                </tbody>
            
            </table>
原文地址:https://www.cnblogs.com/Donnnnnn/p/6282629.html