Question

我试图在使用这行JS＆＃34; $（＆＃34; tr：not（.wb-hide）＆＃34;）过滤时只删除最近的thead。最近（＆＃34; THEAD＆＃34;）addClass（＆＃34; WB隐藏＆＃34;）;＆＃34 ;.问题是这两个问题都被删除了。任何想法或解决方案都将不胜感激。

https://jsfiddle.net/fdjd1obb/

HTML

<label for="idfilter">Find an item:</label>&nbsp;
<input type="text" id="idfilter">
<table>
    <thead>
        <tr>
            <th>Quantity shipped</th>
            <th>Description</th>
            <th>Identifier</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td>questionnaire</td>
            <td>1234</td>
        </tr>
        <tr>
            <td>1</td>
            <td>questionnaire</td>
            <td>1235</td>
        </tr>
        <tr>
            <td>1</td>
            <td>questionnaire</td>
            <td>1236</td>
        </tr>
    </tbody>
</table>
<table>
    <thead>
        <tr>
            <th>Quantity shipped</th>
            <th>Description</th>
            <th>Identifier</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td>questionnaire</td>
            <td>1237</td>
        </tr>
        <tr>
            <td>1</td>
            <td>questionnaire</td>
            <td>1238</td>
        </tr>
        <tr>
            <td>1</td>
            <td>questionnaire</td>
            <td>1239</td>
        </tr>
    </tbody>
</table>

CSS

.wb-hide {
    display:none;
}

JS

    $(document).ready(function () {
        $('#idfilter').focus().keyup(function () {

            var idFilter = $("#idfilter");

            $("tbody tr td:nth-child(3):not(:contains('" + idFilter.val() + "'))").parent("tr").addClass("wb-hide");
            $("tbody tr td:nth-child(3):contains('" + idFilter.val() + "')").parent("tr").removeClass("wb-hide");

            if (idFilter.val() == 0) {
                $("tr").removeClass("wb-hide");
            }

            $("tr:not(.wb-hide)").closest("thead").addClass("wb-hide");

        });
    });

Answer 1

试试这个fiddle：

$('thead').addClass("wb-hide");
$("tbody>tr:not(.wb-hide)").parents('table').find('thead').removeClass("wb-hide");

取代

$("tr:not(.wb-hide)").closest("thead").addClass("wb-hide");

仅删除表过滤中最接近的thead

1 个答案: