当我有更多行时，如何使该表仅显示 10 行，以及在搜索时如何显示其他行？答案

【问题标题】：How do i make this table display only 10 rows when i have more, and how to display others when i search?当我有更多行时，如何使该表仅显示 10 行，以及在搜索时如何显示其他行？
【发布时间】：2016-06-14 13:07:35
【问题描述】：

我使用了这个表：jsfiddle.net/giorgitbs/52ak9/1/，不知道如何拥有更多行但只显示 10 行并且可搜索..

<div class="input-group"> <span class="input-group-addon">Filter</span>

    <input id="filter" type="text" class="form-control" placeholder="Type here...">
</div>
<table class="table table-striped">
    <thead>
        <tr>
            <th>Code</th>
            <th>Name</th>
            <th>Default</th>
            <th>Status</th>
        </tr>
    </thead>
    <tbody class="searchable">
        <tr>
            <td>EUR</td>
            <td>EURO</td>
            <td></td>
            <td>Active</td>
        </tr>
        <tr>
            <td>GBP</td>
            <td>Pound</td>
            <td></td>
            <td>Active</td>
        </tr>
        <tr>
            <td>GEL</td>
            <td>Georgian Lari</td>
            <td><span class="glyphicon glyphicon-ok"></span>
            </td>
            <td>Active</td>
        </tr>
        <tr>
            <td>USD</td>
            <td>US Dollar</td>
            <td></td>
            <td>Active</td>
        </tr>
    </tbody>
</table>

Javascript-

$(document).ready(function () {

    (function ($) {

        $('#filter').keyup(function () {

            var rex = new RegExp($(this).val(), 'i');
            $('.searchable tr').hide();
            $('.searchable tr').filter(function () {
                return rex.test($(this).text());
            }).show();

        })

    }(jQuery));

});

请帮忙

【问题讨论】：

datatables.net 可能就是您要找的。span>
你问的很不清楚。

标签： php jquery html css

【解决方案1】：

您可以使用

插入您的行

.row-class:nth-child(n+10){
    display:none;
}

当通过过滤器输入找到一行时，将可见性更改为display:block

【讨论】：

【解决方案2】：

试试这个

你只需要改变sql查询ajax页面的限制

例如，

$search="test";
if(isset($search)) 
{
  select * from tblname where col_name like %$search%;
} 
else
{
  select * from tblname where limit 0,10;
}

【讨论】：