Javascript 如何使jQuery在浏览器中发挥良好作用；“后退”；按钮？

一般来说，我不太擅长jQuery或Javascript，但我已经设法拼凑出了一些东西。请容忍我，原谅我的无知

基本上，我已经设置了一些jQuery，允许用户单击表行中的任意位置，以选中该行第一列中的复选框。当复选框被选中时，它会向整行添加一个css类。它也反过来工作，取消选中复选框，并删除css类。到目前为止效果很好

失败的情况是，有人选择了几行，然后提交表单，从而导航到我的网站的下一页，但随后意识到他们犯了一个错误，他们点击浏览器返回按钮，返回到这个表，返回他们的选择。当有人这样做时，浏览器会正确地恢复复选框，但不会为这些行设置css类。所以结果是这样的：

复选框，但该行未按应有的方式高亮显示

我确信它们是一些简单的jQuery方法，可以在页面加载时搜索复选框，并在那个时候应用css，但我似乎无法理解

---

任何帮助都将不胜感激！谢谢。

有很多方法

您可以通过循环表数据来检查选中的输入并添加类

演示

代码

$("td").each(function() {
 if ( $("input[type='checkbox']", this).is(":checked")) {
$(this).closest('tr').addClass("active");
  }
});

$("#searchResults").find(":checked").closest('tr').addClass("active");

$("input:checked").closest('tr').addClass("active");

$("tr").has("input:checked").addClass("active");

您还可以使用find来查找使用tables id检查的内容

演示

代码

$("td").each(function() {
 if ( $("input[type='checkbox']", this).is(":checked")) {
$(this).closest('tr').addClass("active");
  }
});

$("#searchResults").find(":checked").closest('tr').addClass("active");

$("input:checked").closest('tr').addClass("active");

$("tr").has("input:checked").addClass("active");

但最简单的方法是使用选择器检查输入

演示

代码

$("td").each(function() {
 if ( $("input[type='checkbox']", this).is(":checked")) {
$(this).closest('tr').addClass("active");
  }
});

$("#searchResults").find(":checked").closest('tr').addClass("active");

$("input:checked").closest('tr').addClass("active");

$("tr").has("input:checked").addClass("active");

或者使用

has

方法

演示

代码

$("td").each(function() {
 if ( $("input[type='checkbox']", this).is(":checked")) {
$(this).closest('tr').addClass("active");
  }
});

$("#searchResults").find(":checked").closest('tr').addClass("active");

$("input:checked").closest('tr').addClass("active");

$("tr").has("input:checked").addClass("active");

代码也可以是这种方式

$("tr:has(input:checked)").addClass("active");

---

非常感谢你！底部的选择非常有效。现在我看到了解决方案，这是非常明显的。@KMurphy没问题，我添加了另一种方法，即使用has方法。