Question

我遇到了一些麻烦。我有一个由PHP创建的表，它从Excel文件中提取数据。我想要做的是让用户能够搜索某些值（用户指定列）以获取值（也是用户指定的值），如果存在指定的值，则突出显示整行。

我一直在做功课，但却找不到适合自己的食物。这是与我的噩梦相关的代码（：

 $(document).ready(function(){
    $("#search").click(function(){
        var searchText;

        if(col == 0 || col == 1 || col ==3){
            searchText = $("#searchText").val()
        }
        else if(col == 6){
            searchText = $("#maxPets option:selected").text();
        }
        else if(col == 7){
            searchText = $("#maxWeight option:selected").text();
        }

        $("myTable tr td:nth-child(" + col +")").each(function () {

            if ($(this).val.indexOf(searchText) !=-1) {
                tr.addClass('result');  }
            else {
                tr.removeClass('result');
                }

        });


    });
});

Answer 1

 $(document).ready(function(){
    $("#search").click(function(){
        var searchText;
        $("tr").removeClass("result");
        if (col == 0 || col == 1 || col == 3) {
            searchText = $("#searchText").val();
        }
        else if(col == 6){
            searchText = $("#maxPets option:selected").text();
        }
        else if(col == 7){
            searchText = $("#maxWeight option:selected").text();
        }
        $("#myTable tr").filter(function() {
            return $("td:eq(" + col + ")", this).text() == searchText;
        }).closest("tr").addClass("result");
    });
});

jsFiddle DEMO -- Updated for partial search

我仍然不知道你从哪里得到col。我想是一个下拉列表。

Answer 2

变化：

        if ($(this).val.indexOf(searchText) !=-1) {
            tr.addClass('result');  }
        else {
            tr.removeClass('result');
            }

为：

        if ($(this).text().indexOf(searchText) !=-1) {
            $(this).closest("tr").addClass('result');  }
        else {
            $(this).closest("tr").removeClass('result');
        }

val是一个jQuery方法，它是一个函数，它不是一个可以搜索的字符串。对于您可能想要的内容，这是错误的方法 - 使用text()读取表字段的内容 - val()是用户输入的值。

并且没有变量tr - 您想要添加/删除元素包含行的类。

这可以进一步简化为：

$(this).closest("tr").toggleClass("result", $(this).text().indexOf(searchText) !=-1);

Jquery表搜索和行突出显示

2 个答案: