JQuery，在表格列中查找结果

Question

我试图在表格列中找到结果，如果它在我下面的函数中设置，其中大部分是由其他人设置的，我只是在其中添加了一些额外内容，我的最后一个是仅按名称搜索 1 列thead 但是在当前版本中什么都没有发生：|

感谢您的帮助

用法

<a href='javascript:searchTable("Bob", "table",1,"Name");'>Test</a> 

桌子

    <table id="table" class="table">
       <thead>
          <tr>
            <th id="blank">&nbsp;</th>
            <th id="Name">Name</th>
            <th id="Dept">Department</th>
            <th id="JobTitle">Job Title</th>
          </tr>
       </thead>
       <tbody>
          <tr>
            <td>&nbsp;</td>
            <td>Bob</td>
            <td>IT</td>
            <td>IT Support</td>
          </tr>    
          <tr>
            <td>&nbsp;</td>
            <td>Fred</td>
            <td>Finance</td>
            <td>Finance Man</td>
          </tr>     
       </tbody>
   </table

功能

function searchTable(inputVal, tablename,starts, column) {
    var table = $(tablename);
    table.find('tr:not(.header)').each(function (index, row) {
        if (column != '') {
            //Columnname
            var Cells = $(row).find('td').eq(column);
        } else {
            //AllCells
            var Cells = $(row).find('td');
        }
        if (Cells.length > 0) {
            var found = false;
            Cells.each(function (index, td) {
                if (starts == 1) {
                    var regExp = new RegExp((starts ? '^' : '') + inputVal, 'i');
                } else {
                    var regExp = new RegExp(inputVal, 'i');
                }

                if (regExp.test($(td).text())) {
                    found = true;
                    return false;
                }
            });
            if (found == true) $(row).show().removeClass('exclude'); else 
            $(row).hide().addClass('exclude');
            }
        });
    }

Answer 1

当您将column 作为字符串传递时，您需要获取相应的元素索引：

var Cells = $(row).find('td:eq(' + $('#' + column).index() + ')');

以上假设您基于id 进行匹配，如果您基于<th> 中的文本进行匹配，则可以使用:contains 选择器：

$(row).find('td:eq(' + $(table.prop('id') + ' th:contains(' + column + ')').index() + ')');

如果你可以控制和修改函数调用，最好的办法就是直接将元素索引传递给函数：

javascript:searchTable("Bob", "table", 1, 1); <-- Would be the "Name" column

这样，您就不必执行上述任何操作。

顺便说一句，根据您的评论，您的表格选择器不正确，不确定这是否只是您的拼写错误？

var table = $(tablename);

应该是：

var table = $('#' + tablename);

Answer 2

我不确定您要控制什么，但您可以使用它来循环遍历行并获取单元格的值。

$("#table>tbody>tr").each(function(){
 var name= $(this).children("td").eq(1).html();//Name
 var department=  $(this).children("td").eq(2).html();//Department
 var jobTitle=  $(this).children("td").eq(2).html();//Job Title
  alert(name);
});

http://jsbin.com/uvefud/1/edit

编辑： 你可以试试这个searchTable函数。

function searchTable(name,tableName,row,column){

var $Tds= $("#"+tableName+">tbody>tr").eq(row-1).children("td");
 if(column=="Name"){
    $Tds.eq(1).html(name);
  }
  else if(column=="Dept"){
    $Tds.eq(2).html(name);
  }
  else if(column=="JobTitle"){
    $Tds.eq(3).html(name);
  }

}

http://jsfiddle.net/W9zpq/2/

用法：这会将tbody第二行的name列更新为'Bob'

searchTable("Bob", "table",2,"Name")