代码之家  ›  专栏  ›  技术社区  ›  wuk986

扩展jquery表搜索脚本

  •  -2
  • wuk986  · 技术社区  · 6 年前

    我有一个jquery表搜索脚本,来自 jQuery scripts 现在我想扩展它以显示 <p> 如果找不到结果,则标记。

    脚本如下:

    $('#searchInput').on('change, input', function() {
        selectOptionFilterVehicle();
        var searchTerm = $(this).val().toLowerCase().trim();
        $('#vehicleTable tbody tr').each(function() {
            var lineStr = $(this).text().toLowerCase();
            if (lineStr.indexOf(searchTerm) === -1) {
                $(this).hide();
            } else {
                $(this).show();
            }
        });
    });
    

    我想我可以添加一个简单的 $('#noVhicle').html('Nothing found'); $('#noVhicle').hide(); 在if语句中,但失败。

    现在我有点困惑,有人能给我解释一下吗?

    1 回复  |  直到 6 年前
        1
  •  1
  •   Artem Saribekian    6 年前

    要处理已建立的项目,您需要创建变量并在找到某个变量时增加它,否则您可以显示错误。

    $('#searchInput').on('change, input', function() {
        // selectOptionFilterVehicle();
        var founded = 0;
        var searchTerm = $(this).val().toLowerCase().trim();
    
        $('#vehicleTable tbody tr').each(function() {
            var lineStr = $(this).text().toLowerCase();
            if (lineStr.indexOf(searchTerm) === -1) {
                $(this).hide();
            } else {
                $(this).show();
                founded += 1;
            }
            if ( founded === 0 ) {
                $("#noVhicle").show();
            } else {
                $("#noVhicle").hide();
            }
        });
    });
    

    Here is the fiddle