使用jQuery比较和突出显示表数据

Question

我有以下结构的表

每当用户单击支票簿并单击链接"比较差异"表列时,应突出显示值是否不同.用户可以选择两个,一旦用户选择三个中的两个(或三个以上),其他行将隐藏,仅显示比较行.

这是代码的链接

编辑:如果该列中的任何值不同,我如何将类添加到colgroup> col？或者我如何添加所选行的类/高亮div与td相比？

Answer 1

    jQuery(document).ready(function() {

                $("#compareme").click(function() {
//get all checkboxes that are not selected
                    var not_selected = $("input:not(:checked)");
//get all checkboxes that are selected
                    var selected = $("input:checked");
                    if($(selected).length < 2) {
//you need more than 1 for comparison
                        alert("please select more than 1 product")
                    } else {
//hide the not selected ones
                        $(not_selected).closest("tr").hide();
                    }
//loop through your columns
                    for(var i = 1; i < 5; i++) {
                        var prev = null;
                        $.each($(selected), function() {

                            var curr = $(this).closest("tr").find("td").eq(i).text();
//if at least one value is different highlight the column
                            if(curr !== prev && prev !== null) {
                                $("col").eq(i).addClass("highlight");
                            }
                            prev = curr;

                        })
                    }

                })
            });