返回浏览器后退按钮后，清除表格中的所有字段 [英] Clear all fields in a form upon going back with browser back button

问题描述

当用户使用浏览器后退按钮时，我需要一种方法来清除表单中的所有字段。现在，浏览器会记住所有最后的值，并在返回时显示它们。

关于为什么需要此功能的更多说明
我有一个禁用的输入字段，它的值是使用一种算法自动生成的，以使其在特定的一组数据中是唯一的。一旦我提交表单并将数据输入到数据库中，用户就不能再次使用相同的值来提交相同的表单。因此，我首先禁用了输入字段。但是，如果用户使用浏览器后退按钮，浏览器会记住最后一个值，并且在输入字段中保留相同的值。因此用户可以再次使用相同的值提交表单。

我不明白当您按下浏览器后退按钮时会发生什么。如果页面大小在浏览器高速缓存限制范围内，似乎整个页面都从缓存中检索到，而无需与服务器联系。当你按下浏览器后退按钮时，如何确保页面从服务器加载而不管浏览器设置如何？ 现在

现代浏览器实现了一种称为后退缓存（BFCache）的功能。当你回击/转发按钮时，实际页面不会重新载入（并且脚本永远不会重新运行）。

如果用户点击时必须做某些事情返回/转发键 - 监听BFCache pageshow 和页面隐藏事件。

一个伪jQuery示例：

  $（window）.bind（pageshow，function（）{
 //更新隐藏的输入字段
}）; 
  

查看 Gecko 和 WebKit 实现。

I need a way to clear all the fields within a form when a user uses the browser back button. Right now, the browser remembers all the last values and displays them when you go back.

More clarification on why I need this I've a disabled input field whose value is auto-generated using an algorithm to make it unique within a certain group of data. Once I've submitted the form and data is entered into the database, user should not be able to use the same value again to submit the same form. Hence I've disabled the input field in the first place. But if the user uses the browser back button, the browser remembers the last value and the same value is retained in the input field. Hence the user can submit the form with the same value again.

What I don't understand is what exactly happens when you press the browser back button. It seem like the entire page is retrieved from cache without ever contacting the server if the page size is within the browser cache limit. How do I ensure that the page is loaded from the server regardless of browser setting when you press the browser back button?

解决方案

Modern browsers implement something known as back-forward cache (BFCache). When you hit back/forward button the actual page is not reloaded (and the scripts are never re-run).

If you have to do something in case of user hitting back/forward keys -- listen for BFCache pageshow and pagehide events.

A pseudo jQuery example:

$(window).bind("pageshow", function() {
  // update hidden input field
});

See more details for Gecko and WebKit implementations.

这篇关于返回浏览器后退按钮后，清除表格中的所有字段的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！