weixin_58648225 2021-06-01 16:04 采纳率: 89.2%
浏览 53
已采纳

laravel关于js实现的瞬时查询的问题

模板页面:

            <form action="" method="get" class="box-tools">
                <div class="box-tools">
                    <div class="input-group input-group-sm hidden-xs" style="width: 750px;">
                        <input type="text" name="table_search" id="myInput" onkeyup="myFunction()" placeholder="搜索" value="{{ request()->get('table_search','') }}" >

                {{--        <div class="input-group-btn">
                            <button type="submit" class="btn btn-default"><i class="fa fa-search"></i></button>
                        </div>         --}}
                    </div>
                </div>
            </form>
            </div>
            <div class="box-body table-responsive no-padding">
                <table id="MyTable" class="table table-hover">
                    <tr>
                        <th>学生姓名</th>
                        <th>联系电话</th>
                        <th>缴费状态</th>
                        <th>星级</th>
                        <th>提醒</th>
                        <th>项目</th>
                        <th>项目类别</th>
                        <th>信息录入人</th>
                    </tr>
                    @foreach($data as $obj)
                    <tr>
                        <input type="hidden" name="student_id" value="{{ $obj->id }}">
                        <td><a href="#">{{ $obj->name }}</a></td>
                        <td><a href="#">{{ $obj->tel }}</a></td>
                        <td><a href="#">{{ $obj->payment_status_id }}</a></td>
                        <td><a href="#">{{ $obj->stat_lv }}</a></td>
                        <td><a href="#">{{ $obj->notification }}</a></td>
                        <td><a href="#">{{ $obj->project_id }}</a></td>
                        <td><a href="#">{{ $obj->project_type_id }}</a></td>
                        <td><a href="#">{{ $obj->user_id }}</a></td>
                        <td>
                            <a href="{{ $obj->id }}/detail" class="btn btn-xs btn-primary">详细/修改</a>
                            <a href="{{ $obj->id }}/delete" class="btn btn-xs btn-danger">删除</a>

                        </td>
                    </tr>
                    @endforeach
                </table>
            </div>
        </div>
    </div>
</div>

 

js页面:

function myFunction() {

    var input, filter, table, td, a, b, c;
    input = document.getElementById('myInput');
    filter = input.value.toUpperCase();   //转换大小写,不依赖ID查询的话好像没什么用
    table = document.getElementById("MyTable");
    td = table.getElementsByTagName('td');

    // 这里尝试循环一下
    for (b = 0; b < td.length; b++) {
        a = td[b].getElementsByTagName("a")[0];
        if (a.innerHTML.toUpperCase().indexOf(filter) > -1) {
            td[b].style.display = "";
            for (c = 0; c < td.length; c++) {
                td[c].style.display = "";
            }
        }
            else {
            td[b].style.display = "none";
        }
    }
}

 初学者搞了一个下午还是有所困难,如何实现查询时下方得出与VALUE相等的ID的一串儿信息,并且隐藏其它信息。

 

感谢回答~!

  • 写回答

3条回答 默认 最新

  • 关注
    function myFunction() {
    
        var input, filter, table, tr, a, b, c;
        input = document.getElementById('myInput');
        filter = input.value.toUpperCase();   //转换大小写,不依赖ID查询的话好像没什么用
        table = document.getElementById("MyTable");
        tr = table.getElementsByTagName('tr');
    
        // 这里尝试循环一下
        for (b = 1; b < tr.length; b++) {
            a = tr[b].getElementsByTagName("a")[0];
            if (a.innerHTML.toUpperCase().indexOf(filter) > -1) {
                tr[b].style.display = "";
            }
            else {
                tr[b].style.display = "none";
            }
        }
    }
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(2条)

报告相同问题?

悬赏问题

  • ¥15 关于#r语言#的问题:(svydesign)为什么在一个大的数据集中抽取了一个小数据集
  • ¥15 C++使用Gunplot
  • ¥15 这个电路是如何实现路灯控制器的,原理是什么,怎么求解灯亮起后熄灭的时间如图?
  • ¥15 matlab数字图像处理频率域滤波
  • ¥15 在abaqus做了二维正交切削模型,给刀具添加了超声振动条件后输出切削力为什么比普通切削增大这么多
  • ¥15 ELGamal和paillier计算效率谁快?
  • ¥15 file converter 转换格式失败 报错 Error marking filters as finished,如何解决?
  • ¥15 Arcgis相交分析无法绘制一个或多个图形
  • ¥15 关于#r语言#的问题:差异分析前数据准备,报错Error in data[, sampleName1] : subscript out of bounds请问怎么解决呀以下是全部代码:
  • ¥15 seatunnel-web使用SQL组件时候后台报错,无法找到表格