我如何摆脱表单输入值缓存在JavaScript

Question

这是我的JavaScript代码:

function myfunction() {
    var increment = $("#increment").val();
    $("#increment").val(parseInt($("#increment").val()) + 1);
}

HTML:

和

<input id="increment" value="0" type="hidden">

这个想法是，当我点击我的按钮myfunction被调用，并增加我的输入类型隐藏1。它的工作原理。如果按下F5按钮，从输入类型隐藏的值保持与最后的增量数。

如果我按Ctrl+F5，我输入的值将被设置为0。为什么?当我简单地用F5刷新页面时，我如何构建我的代码以将我的输入设置为0 ?

Answer 1

您可以简单地在页面加载时将该值设置为0:

$(function() {
    $("#increment").val('0');
});

Answer 2

编辑:Samuels上面的回答巧妙地解决了这个问题，即通过将其重置为0。我下面的答案是防止浏览器在刷新时持久化FORM数据的通用方法。要做到这一点，需要禁用浏览器缓存。

你需要在浏览器中禁用客户端缓存。

在客户端做到这一点的唯一方法是使用meta标签:

<meta http-equiv="cache-control" content="max-age=0" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
<meta http-equiv="pragma" content="no-cache" />

Answer 3

在函数之前执行以下操作:

$('#increment').val(''); // This should always make the input clear of any value when the page loads
function myfunction(){
    var increment = $("#increment").val();
    $("#increment").val(parseInt($("#increment").val()) + 1);
}