Question

我创建了一个小的html文件，允许用户使用两个下拉菜单选择两列。

用户选择两列并单击“比较”按钮后，将显示两个选定的列。

接下来，用户应该查看两列之间的差异（它们具有不同的背景颜色）。彩色列中包含相同文本的行应显示文本＆＃34;无更改＆＃34;。

这是一个更好地说明我的问题的小提琴：

我尝试使用此代码：

$(".tabella tr").each(function(){
    if($(this).find("td.slot1").text()==$(this).find("td.slot2").text())
    {
       $(this).find("td.slot2").text("MATCHED!");
    }   
});

......但它不起作用：（。

最后一个问题（抱歉）：如果您点击COMPARE按钮，则会显示两列。如果您选择其他列并重新单击“比较”按钮，则右侧会显示其他列。再次单击COMPARE按钮时如何重置整个页面？

也许我可以隐藏COMPARE按钮并显示将重新加载页面的另一个按钮（RESET）。这将是我的新手方法。获得相同结果的最佳方法是什么？

Answer 1

您对 tabella 的引用与任何元素都不匹配;将您的选择器更改为：

$("table tr").each(function() { ... });

使用一些额外的行，您可以将表重置为原始状态，而无需重新加载页面。

基于您的代码的完整示例：

JSFIDDLE

Jquery在表中选择两列并逐行比较TD值

1 个答案: