JQuery,在表列中查找结果

JQuery, Find results in table column

本文关键字:查找 结果 JQuery      更新时间:2023-09-26

我试图找到一个表列的结果,如果它设置在我的函数下面,这大部分是由别人设置的,我只是添加了一些额外的到它,我的最后一个是搜索1列只按名称设置在头部,但唉,在其当前版本什么都没有发生:|

谢谢你的帮助

使用
<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');
            }
        });
    }

当您将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);

我不确定你想控制什么,但你可以使用它来循环行并获得单元格的值。

$("#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/

用法:这将更新body的第二行name列为'Bob'

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