如何为后退按钮保留网页表单内容

当提交网页表单并将用户转到其他页面时，用户通常会点击后退按钮以便再次提交表单（在我的情况下，该表单是高级搜索。）如何为后退按钮保留网页表单内容

如何可靠地保存用户选择的表单选项时，他们单击后退（因此，他们不必从头开始，再次填写表单）只是改变了许多表单元素之一吗？）

我是否必须在会话数据（cookie或服务器端）中存储表单选项的路径，还是有办法让浏览器处理这个我？

（环境是PHP/JavaScript的 - 而网站必须在IE6 +和Firefox2 +工作）

来源

2008-10-29 Peter Howe

我把它放在了会议。
这将是最可靠的，即使他们不直接“返回”，它仍然有他们的搜索选项。把它放入cookie也可以，但是除非是非常小的形式，否则不会被推荐。

来源

2008-10-29 17:00:20 Greg

我相信你是在浏览器的摆布。当你回击时，浏览器不会向服务器提出新的内容请求，它会使用缓存（几乎在任何我见过的浏览器中）。所以任何服务器端都不可用。

我想知道你是否可以做一些非常复杂的事情，比如在结果页面的onunload事件中将搜索结果存储在cookie中，然后在搜索页面上读取JavaScript中的cookie并填写表单 - 但这只是猜测，我不知道它是否会起作用。

来源

2008-10-29 17:00:51

服务器端不一定不是一个选项 - 再次为页面执行JavaScript - 所以我们可以发出Ajax请求。 – 2008-10-29 17:03:40

这是真的。我忘了那个。 – 2008-10-29 17:05:15

您遇到的问题是浏览器将返回缓存版本的页面，并且可能不再向服务器请求它，这意味着使用会话将是无关紧要的。

然而，您可以使用AJAX在页面的加载事件中加载先前提交的表单的详细信息。

来源

2008-10-29 17:04:27 Ady

您基本上必须以某种方式将它存储在您的服务器上（可能在会话变量中，如建议）后。您还必须在表单页面上设置Javascript才能执行加载以发出AJAX调用以从您的服务器获取数据（例如JSON格式）并预先填写表单字段和数据。

示例jQuery代码：

$(document).ready(function() { 
    $.getJSON(
    "/getformdata.php", 
    function(data) { 
     $.each(data.items, function(i,item) { 
     $('#' + item.eid).val(item.val); 
     }); 
    }); 
});

你/getformdata.php可能返回数据，如：

{ 
    'items': [ 
    { 
     'eid': 'formfield1', 
     'val': 'John', 
    }, 
    { 
     'eid': 'formfield2', 
     'val': 'Doe', 
    } 
    ] 
}

，如果没有什么了会议尚未保存为这显然返回一个空数组。上面的代码很粗糙，没有经过测试，但是应该给你基本的想法。

附注：当前版本的Opera和Firefox将在返回时保留表单字段内容。你的JS代码会覆盖这个，但这应该是安全的。

来源

2008-10-29 17:13:57 Pistos

另一个ajaxy选项（对没有javascript的用户不适用）是通过javascript提交表单，然后进入确认页面（或通过用消息替换按钮来显示表单上的消息）。这样就没有“回”的可能。

来源

2008-10-29 17:14:21 afroginthevalley

为什么不在提交之前将值存储到cookie中？您还可以包含一个时间戳或标记来指示它何时填写。然后，当页面加载时，您可以确定是否应该使用cookie中的数据填写字段，或者将它们留为空白，因为这是新的搜索。

来源

2008-10-29 17:18:36

这取决于浏览器，但在大多数情况下，您无需执行任何操作。

IE，Firefox等会高兴地记住上一页中表单的内容，并在点击返回时再次显示它......只要您不做任何事情来阻止该工作，如使页面无缓存或完全由脚本构建表单。

（会话把东西可能与两个标签相同的形式开放混淆的浏览器。在做这样的事情时要非常小心。）

来源

2008-10-29 17:35:29 bobince

你也可以做的一切由JavaScript地方。因此，您存储一个包含搜索值的cookie，并在页面加载中检查cookie是否存在。这样的事情：

$('#formSubmitButton').click(function() { 
    var value = $('#searchbox').val(); 
    var days = 1; 
    var date = new Date(); 
    date.setTime(date.getTime()+(days*24*60*60*1000)); 
    var expires = "; expires="+date.toGMTString(); 
    document.cookie = "searchbox="+value+expires+"; path=/"; 
}); 

$(document).ready(function() { 
    var nameEQ = "searchbox="; 
    var ca = document.cookie.split(';'); 
    for(var i=0;i < ca.length;i++) { 
     var c = ca[i]; 
     while (c.charAt(0)==' ') c = c.substring(1,c.length); 
     if (c.indexOf(nameEQ) == 0) var valueC = c.substring(nameEQ.length,c.length); 
    } 
    $('#searchbox').val(valueC); 
});

没有测试过，但是应该工作。你将需要jQuery。

Cookie的功能来自：http://www.quirksmode.org/js/cookies.html

我应该说是顺便说一句Firefox和IE都具有默认这种行为。

来源

2008-11-08 22:57:55

如何为后退按钮保留网页表单内容

回答

相关问题