Jquery比较两个表中的行

时间:2016-03-27 04:10:50

标签: javascript php jquery html css

我必须使用jquery比较两个表的单元格中的值。 在表格的值中,我应该将firstname,middlename和last name与表2进行比较。如果这3个值与表2行匹配,那么我应该为第二个表中的行着色。

Fiddle

<table id="T1" border='1'>
  <thead>
    <tr>
      <th>First Name</th>
      <th>Middle Name</th>
      <th>Last Name</th>
      <th>Suffix</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>12</td>
      <td>34</td>
      <td>56</td>
      <td>78</td>
    </tr>
  </tbody>
</table>

<table id="T2" border='1'>
  <thead>
    <tr>
      <th>First Name</th>
      <th>Middle Name</th>
      <th>Last Name</th>
      <th>Suffix</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>12</td>
      <td>34</td>
      <td>56</td>
      <td>23</td>
    </tr>
    <tr>
      <td>bat</td>
      <td>man</td>
      <td>11</td>
      <td>21212</td>
    </tr>
    <tr>
      <td>james</td>
      <td>bond</td>
      <td>007</td>
      <td>dadadada</td>
    </tr>
    <tr>
      <td>12</td>
      <td>34</td>
      <td>56</td>
      <td>78</td>
    </tr>
  </tbody>
</table>

<br /><br /><br /><br />

<button id="btn">color if matches</button>

1 个答案:

答案 0 :(得分:0)

试试这个:

$(function(){
    $('#btn').on('click', function(e){
        $('#T1 tbody tr').each(function(){
        var row = $(this);
        var left_cols = $(this).find("td:lt(3)");
        $('#T2 tbody tr').each(function(){
            var right_cols = $(this).find("td:lt(3)");
            if(left_cols.html() == right_cols.html()) {
                left_cols.css('background-color', 'green').css('color', 'red');
                right_cols.css('background-color', 'green').css('color', 'red');
             }
         });
      });
   });
});

希望这有帮助。