在单击浏览器后退按钮时获取用户选择答案

【问题标题】：Getting user selections on clicking browser back button在单击浏览器后退按钮时获取用户选择
【发布时间】：2011-08-12 23:59:41
【问题描述】：

我的申请有几页。在某些页面上，我在其他页面上给出了后退按钮，但没有给出（客户的要求）。现在在特定页面上，我有一个供用户选择的选项列表（选项是使用 jQuery 插件的图像幻灯片）。选择一个选项将用户带到下一页。现在我想获得与单击浏览器后退按钮时突出显示的相同选择的相同页面。单击浏览器后退按钮时，我猜该页面正在重新加载丢失 cookie 值，即当我从图像集中选择图像时，它会将我带到另一个页面。单击浏览器后退按钮时，我想从该集合中选择具有相同图像的页面。是否有任何解决方法，以便我也可以在浏览器上获取所选值。

【问题讨论】：

标签： php javascript jquery browser cross-browser

【解决方案1】：

另一个插件可以做到这一点：

jQuery BBQ 利用 HTML5 hashchange 事件来实现简单但功能强大的可书签 #hash 历史记录。此外，jQuery BBQ 提供了完整的 .deparam() 方法，以及散列状态管理，以及片段/查询字符串解析和合并实用方法。

http://benalman.com/projects/jquery-bbq-plugin/

【讨论】：

【解决方案2】：

您可以利用onunload 事件，当使用后退/前进/刷新按钮时，几乎所有主要浏览器* 都会触发该事件。让onunload 事件处理程序向 PHP 脚本同步发送一个 AJAX 请求，其中包含恢复当前页面状态所需的所有值：

$(window).unload(function() {

    // Insert your code here to collect all values
    // necessary to save a restorable state of the
    // current page.
    //
    // var pageState = {
    //     page: host.pathname,
    //     :
    // };

    $.ajax({
        type: "POST",
        async: false,
        url: "http://mydomain.com/mysave.php",
        data: jQuery.param(pageState),
        error: function(jqXHR, textStatus, errorThrown){
            // your code
        }
        success: function(data, textStatus, jqXHR){
            // your code
        }
    });  

});

让 PHP 脚本将接收到的页面状态保存在某处（例如会话、数据库等），以便在您要生成要恢复到以前状态的页面时使用它。

请注意，此解决方案可能存在缺点。

同步请求用于给服务器一个真正的机会来完整地接收和处理请求。异步请求将立即返回，因此已经加载了新页面，可能在完成（甚至发送）之前取消并行运行的异步请求。

Otoh 同步请求阻塞（冻结浏览器，用户不能做任何事情），直到服务器响应。如果您的服务器没有响应，这将导致死锁。不幸的是，没有办法在客户端取消同步请求（至少我知道没有），因此您应该始终保持同步请求尽可能短（服务器端处理时间）。并确保您拥有快速可靠的服务器，但无论如何您都应该拥有它^^。

*_{但请注意，某些浏览器（例如 Opera）不会在使用特定浏览器按钮时触发 onunload 事件。}

【讨论】：