Question

我有一个页面，其中包含一个表单中的几个复选框，选中后，使用jquery从表中过滤相应的信息。我的问题是以下情况：

有人检查一个或多个方框，隐藏表格中的行
他们点击链接，转到另一页
他们点击后退按钮。

此时，仍然会选中复选框（至少在chrome中），但所有表行都可以再次显示。

任何想法？

Answer 1

如果您的目标是让他们回到他们离开前的确切视图（表格行仍然隐藏）：

这是网站的一个缺点（或优势）：它是无国籍的，特别是在客户端操作方面。

您需要做的是将应用程序状态存储在URL哈希标记中，以便当用户使用其后退按钮时，您可以检索“状态”并重新构建其视图。

以下是另一个问题，其答案可能会对您有所帮助：jquery javascript: adding browser history back with hashtag?

如果您的目标是将页面恢复到初始状态：

只需重置页面加载时的所有复选框：

$('input:checkbox').prop('checked', false);

-OR -

重置整个表单：

$(':input','#myform')
 .not(':button, :submit, :reset, :hidden')
 .val('')
 .prop('checked', false)
 .prop('selected', false);

Answer 2

不允许缓存页面，或添加代码以重置表单：

$("form input").each(function(){
    var elem = $(this);
    var type = elem.attr("type");
    if(type == "checkbox") elem.prop("checked", "");
    else if(type == "text") elem.val("");
});

必须使用

.each，因为CSS选择器input[type=text]与<input />不匹配，而元素仍然是文本元素。

Answer 3

对于IE在提交后重置表单，对我没有帮助。而是遵循代码为我工作。页面加载事件也会在浏览器后退按钮上调用。

$(window).load(function() {
    $('form').get(0).reset(); //clear form data on page load
});

Answer 4

所以问题不在于浏览器缓存用户输入，而是没有隐藏行。您可以通过添加一个jQuery脚本轻松解决此问题，该脚本将检查是否选中了复选框（加载页面后）。如果选中它，则隐藏行：）

伪代码：

1. wait for the page to load
2. for each checkbox check if checked
3. if it's checked, hide the corresponding row in the same way you did when the user checked it.

后退按钮上的清晰表格？

4 个答案: