Ich habe eine einfache HTML-Tabelle mit einer <input type="text">

<input class="font-15 w-300-px" id="SomeID" type="text">
<table id="myTable">
        <thead>
            <tr class="header">
                <th style="width:20%;">One</th>
                <th style="width:20%;">Two</th>
                <th style="width:20%;">Three</th>
                <th style="width:20%;">Four</th>
                <th style="width:20%;">Five</th>
                <th style="width:20%;">Six</th>
            </tr>
        </thead>
        <tbody>
                <tr>
                    <td>
                        <a href="www.w3school.com" target="_blank">
                            aaa
                        </a>
                    </td>
                    <td>
                        <a href="www.idk.com" target="_blank">
                            bb
                        </a>
                    </td>
                    <td>ccc</td>
                    <td>dddd</td>
                    <td>eeee</td>
                    <td>ffff</td>
                </tr>
        </tbody>
    </table>

Dann habe ich dieses Skript zum Filtern. `

var $rows = $('#myTable tr:gt(0)');
        $('#SomeID').keyup(function () {
            var val = $.trim($(this).val()).replace(/ +/g, ' ').toLowerCase();

            $rows.hide().filter(function () {
                var text = $(this).text().replace(/\s+/g, ' ').toLowerCase();
                return ~text.indexOf(val);
            }).show();
        });

Mein Problem ist, dass das Filtern so lange dauert (ich habe viele Zeilen). Gibt es eine Möglichkeit, nur etwa 150 Zeilen anzuzeigen? Ist dies ein guter Weg, um dieses Problem zu lösen? Sollte ich eine andere Methode zum Filtern verwenden? Danke für alles.

0
user12828969 19 Aug. 2020 im 14:23

2 Antworten

Beste Antwort

Verwenden Sie die Jquery Data-Tabellenansatzfunktion, um die Standardsuch- und Sortierfunktion bereitzustellen. Sie können auch eine spaltenspezifische Suche hinzufügen.

  1. $ ("# Your_Table_Id"). DataTable (); Die folgende Zeile konvertiert Ihre Tabelle in jquery datatable.

Für weitere Informationen klicken Sie hier

1
Mayur Asodariya 19 Aug. 2020 im 12:31

Wenn Sie nur 150 Zeilen möchten, verwenden Sie einen Iterator, der bei 0 beginnt und bei 150 endet, und filtern Sie darin. Nachdem Sie die 150. Zeile erreicht haben, sollte die Filterung beendet werden. Dies ist wahrscheinlich keine vollständige Antwort, da ich kein Js-Entwickler bin. Versuchen Sie jedoch, in diese Richtung zu experimentieren oder zu suchen, während Ihnen jemand eine genauere Antwort gibt.

Es gibt viele beantwortete Fragen zum Durchlaufen von Tabellen, und ich denke, es gibt eine bessere Möglichkeit zum Filtern, z. B. das Durchlaufen jeder Zeile und das Definieren einer Anforderung mit einer If-Anweisung, um zu bestimmen, ob Sie etwas mit der Zeile tun oder zu gehen möchten der Nächste.

0
Borna Ungar 19 Aug. 2020 im 12:44