Question

我有一张表格。成功提交后，服务器端重定向以查看新条目。

问题：按下后退按钮后，所有输入仍然填充了最后一个值（它不会自动重新提交表单或显示“确认表单提交”提示）。这允许用户再次手动点击“提交”并非常容易地提交重复的条目，这是我想要避免的。请注意，这不是经典的“重新发布”问题，我们使用post / redirect / get模式。

表单中有20多个字段，从技术上讲，可能两个相同的条目可能是合法的，但我只想在用户按下后退按钮时清除字段。< / p>

这是我尝试过的：

无缓存标头

header('Cache-Control: must-revalidate, no-store, no-cache, private, max-age=0');
header('Pragma: no-cache');
header('Expires: Sat, 26 Jul 1997 05:00:00 GMT');

无缓存元标记的组合

<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" />

使用javascript提交和重定向

$('form').submit(function(){
    $.post($(this).attr('action'), $(this).serialize(), function(response){
        window.location = response.redirectUrl;
    });
});

提交表单后“刷新”重定向

header('refresh:0; url=view_entry');

会话数据触发的刷新（在这里变得有点hacky ......）

// psuedo PHP code for the "add" page
if ($_SESSION['submit']) {
    $_SESSION['submit'] = 0;
    redirect(current_url); // Cross fingers and hope this clears the form
}
if ($formValid and $saveEntry) {
    $_SESSION['submit'] = 1;
    redirect(next_url);
}

这些都不起作用，在按下后退按钮后仍然填充了字段。最后一个选项实际上触发了“确认表单提交”提示，这不是我想要的，但至少它有点好。

我应该提一下，这是谷歌Chrome。如果有帮助，可以使用Codeigniter和jQuery。在发布成功的条目后，我只想在用户点击后退按钮后清除表单字段。我实际上并没有记得以前遇到这个问题，而且我完全没有想法。什么是正确的方法？

Answer 1

快速简便的方法是在响应之后和重定向之前单独清除字段。

$('form').submit(function(){
    $.post($(this).attr('action'), $(this).serialize(), function(response){
        // HERE, clear the fields like...
        $("#field_id_1").val('');
        $("#field_id_2").val('');
        // THEN do the redirect
        window.location = response.redirectUrl;
    });
});

它可能不是最全面的解决方案，但由于您无论如何都是使用ajax调用进行提交，因此没有理由不这样做。

单击后退按钮后，防止表单字段重新填充

1 个答案: