Question

在表格中搜索时遇到问题。就像我尝试list.js一样，但它没有用。我找到了这段代码，但这也没有用。

var $rows = $('#table tr');
        $('#search').keyup(function() {
            var val = $.trim($(this).val()).replace(/ +/g, ' ').toLowerCase();

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

我测试了，功能甚至不会触发。我试着提醒一下。我无法看到问题，但我对JS / jQuery不太好，所以也许我在某处犯了错误：/

BTW：这是表格HTML：

<table id="table" class="mdl-data-table mdl-js-data-table mdl-shadow--2dp">
    <tr>
        <th></th>
        <th>Jméno</th><th>Příjmení</th>
        <th>Adresa</th><th>Datum narození</th>
        <th>Pohlaví</th><th>Připomenutí</th>
        <th>Poslední kontakt</th><th>Skupina</th>
    </tr>
    <tr style='cursor:pointer;' onclick='window.location.href = "./mf_contact_form.php?cid=168"'>
        <td>
            <span style='margin: 0px; padding: 0px; width:1px; background:#da00ff; float:left; margin-left: -20px; height: 100%;'></span><img src='[HIDDEN]' style='width: 64px; height: 64px; border-radius: 50%;'>
        </td>
        <td>
            Test
        </td>
        <td>
            Test
        </td>
        <td>
            Test
        </td>
        <td>
            5615-12-06
        </td>
        <td>
            Muž
        </td>
        <td>
            3x za týden
        </td>
        <td>
            Žádná historie
        </td>
        <td>
            gjh
        </td>
    </tr>
</table>

它是由PHP生成的，但我认为这不会导致这个问题。

Answer 1

正如Yury Tarabanko所说（“#search输入在您执行代码时实际可用吗？请尝试console.log($('#search').length)。如果长度为0.您需要将脚本标记放在正文的末尾（至少在输入和表格之下），或使用dom ready事件$(function(){/*your code here*/})“ - Yury Tarabanko）

执行代码时输入不可用

JS表搜索/排序/过滤

1 个答案: