【问题标题】:Compare two rows (HTML Table) data i.e..row[i] with row[i+1] and highlight changes using Jquery/Javascript比较两行(HTML 表)数据,即 .row[i] 与 row[i+1] 并使用 Jquery/Javascript 突出显示更改
【发布时间】:2015-07-23 07:07:47
【问题描述】:

比较两行数据,即row[i]row[i+1],并使用Jquery/Javascript 突出显示更改。这是为了显示一个工件的历史。看了很多答案,画了一个空白。对于jsfiddle 示例的任何帮助将不胜感激。

想要对这个小提琴的作用进行转置。http://jsfiddle.net/hA5G8/18/ .它比较同一行中的列。只需要比较行之间的列。

【问题讨论】:

  • 如果您发布一些代码并指出您遇到的问题,那将是一个好主意。让其他人更容易提供帮助。

标签: javascript jquery html datatables html-table


【解决方案1】:

这是更新后的小提琴http://jsfiddle.net/Lbuxpmyq/1/

谢谢!!

HTML

                <table id="coa_history_data">
                <tr class="data-in-table">
                    <th>old Name</th>
                    <th>New Name</th>
                    <th>Old Phone</th>
                    <th>New Phone</th>
                    <th>Old Age</th>
                    <th>New Age</th>
                </tr>
                <tbody>
                    <tr class="data-in-table">
                        <td>Alphy</td>
                        <td>Alphy</td>
                        <td>015</td>//should be highlited
                        <td>016</td>//should be highlited
                        <td>23</td>//should be highlited
                        <td>24</td>//should be highlited</tr>
                    <tr class="data-in-table">
                        <td>Tom</td>
                        <td>Tom</td>
                        <td>12</td>
                        <td>12</td>
                        <td>65</td>//should be highlited
                        <td>30</td>//should be highlited</tr>
                    <tr class="data-in-table">
                        <td>will</td>
                        <td>will</td>
                        <td>12</td>
                        <td>12</td>
                        <td>20</td>
                        <td>20</td>
                    </tr>
                </tbody>
            </table>

jQuery

$("#coa_history_data tbody tr.data-in-table").each(function () {
            var i=0;
                $(this).find('td').each(function (index) {
                    var currentCell = $(this);
                    var nextCell = $(this).closest('tr').next('tr').find('td').eq(i).length > 0 ? $(this).closest('tr').next('tr').find('td').eq(i) : null;
                    if ( currentCell.text() !== nextCell.text()) {
                        currentCell.css('backgroundColor', 'yellow');
                    }
                    i=i+1;
                });
            });

【讨论】:

    猜你喜欢
    • 2012-07-17
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-04-09
    • 1970-01-01
    • 2017-11-28
    • 2012-01-13
    • 1970-01-01
    相关资源
    最近更新 更多