要从 Web 表中选择一行？

Question

这是我用来从这个特定表中选择一行的代码。以下代码必须选择包含 Position-"Engineer' 和 Age=34 的行。而是选择整个表。有人可以解释一下为什么会发生这种情况以及可以添加什么来避免它。

$(document).ready(function(){
  var dict={1:"Engineer",3:"34"};
  var a=Object.keys(dict);
    if ( (a+"").match(/^\d+$/) ) 
                {
                  var colidx = Object.keys(dict);
                  $('#example tbody tr').filter(function(idx, ele) {
                    var val = colidx.filter(function(colname, idx) {
                      var colvalue = dict[colname];
                      return ($(ele).find('td').eq(colidx[idx]).text() == colvalue)
                    });
                    return val.length == colidx.length }).css('background-color', 'red');
                }
             else 
                {
                  var coli = {};
                  $('#example thead tr th').filter(function(i, e) {
                    var keycol = e.textContent;
                    var keyval = Object.keys(dict).indexOf(keycol);
                    if (keyval != -1) {
                      coli[keycol] = i;
                    }
                  });
                  var colidx = Object.keys(coli);
                  $('#example tbody tr').filter(function(idx, ele) {
                    var val = colidx.filter(function(colname, idx) {
                      var colvalue = dict[colname];
                      var colindex = coli[colname];
                      return ($(ele).find('td').eq(colindex).text() == colvalue)
                    });
                    return val.length == colidx.length;
                  }).css('background-color', 'red');
      }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="example" class="display" width="100%">
  <thead>
    <tr>
      <th>Name</th>
      <th>Position</th>
      <th>Office</th>
      <th>Age</th>
      <th>Start date</th>
      <th>Salary</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Kavya</td>
      <td>Engineer</td>
      <td>Mumbai</td>
      <td>34</td>
      <td>2011/04/25</td>
      <td>1,20,000</td>
    </tr>
    <tr>
      <td>Archana</td>
      <td>Accountant</td>
      <td>Delhi</td>
      <td>21</td>
      <td>2011/07/25</td>
      <td>170,750</td>
    </tr>
    <tr>
      <td>kranthi</td>
      <td>Technical Author</td>
      <td>Chennai</td>
      <td>23</td>
      <td>2009/01/12</td>
      <td>86,000</td>
    </tr>
    <tr>
      <td>Srija</td>
      <td>Javascript Developer</td>
      <td>Pune</td>
      <td>22</td>
      <td>2012/03/29</td>
      <td>433,060</td>
    </tr>
    <tr>
      <td>Priyanka</td>
      <td>Engineer</td>
      <td>Mysore</td>
      <td>33</td>
      <td>2008/11/28</td>
      <td>162,700</td>
    </tr>
    <tr>
      <td>Himanshu</td>
      <td>Integration Specialist</td>
      <td>Goa</td>
      <td>51</td>
      <td>2012/12/02</td>
      <td>372,000</td>
    </tr>
    <tr>
      <td>Vishwam</td>
      <td>System Architect</td>
      <td>Jharkand</td>
      <td>69</td>
      <td>2011/04/25</td>
      <td>320,800</td>
    </tr>
    <tr>
      <td>Akhila</td>
      <td>Sales Assistant</td>
      <td>Hyderabad</td>
      <td>59</td>
      <td>2012/08/06</td>
      <td>137,500</td>
   </tr>
    <tr>
      <td>Ashwini</td>
      <td>Javascript Developer</td>
      <td>Bhuvaneshwar</td>
      <td>39</td>
      <td>2009/09/15</td>
      <td>205,500</td>
    </tr>
 
  </tbody>
</table>

Answer 1

你可以这样做

更新：使用带有索引值和名称值的字典的示例

$(function() {
  var dict = {0:"Srija", "Office": "Pune", 3: "22"};
  dict = buildIndexValueDictionary(dict);
  runSearchByDict(dict);
});

function buildIndexValueDictionary(dict){
  var header = $("table thead tr th")
  var result = {};
  for (var key in dict) {
    if(isNaN(key)){
      result[getIndexByColumnName(header, key)] = dict[key];
    }
    else{
      result[key] = dict[key];
    }
  }
  return result;
}

function getIndexByColumnName(header, key){
  for(var i = 0; i < header.length; i++){
    if($(header[i]).html() == key){
      return i;
    }
  }
}

function runSearchByDict(dict) {
      var arrayIndex = new Array();
      var arrayValues = new Array();
      for (var key in dict) {
        arrayIndex.push(key);
        arrayValues.push(dict[key]);
      }
      var matchedRows = selectRowByDict(arrayIndex, arrayValues);
      for (var i = 0; i < matchedRows.length; i++) {
        console.log($(matchedRows[i]).html());
      }
}

function selectRowByDict(arrayIndex, arrayValues){
  var result = new Array();
  var rows = $("table tbody tr");
  for(var j = 0; j < rows.length; j++){
    var cells = $(rows[j]).find("td");
    var validRow = true;
    for(var i = 0; i < arrayIndex.length && validRow; i++){
      if($(cells[arrayIndex[i]]).html() != arrayValues[i]){
        validRow = false;
      }
    }
    if(validRow){
      result.push($(rows[j]));
    }
  }
  return result;
}