保留表单字段和jQuery VAR值时，浏览器后退按钮点击

我有一个使用下面的平台/技术编写的Web项目：保留表单字段和jQuery VAR值时，浏览器后退按钮点击

ASP.NET and MVC5/C# 
.NET Framework 4.5.1 
jQuery 2.1.1 
jQuery UI 1.10.4

这个应用程序编写为跨浏览器兼容和响应。

该应用程序有几个页面，其中包含工程师用来输入数值的许多复杂表单域。这些值是温度，流体和气流公差，散热极限等。有许多下拉列表可以选择输入和输出的测量单位（摄氏度/华氏度，米/英尺每秒和许多其他）。

选择一个度量单位后，其关联的表单字段值将被转换，并且表单字段值将被相应地使用jQuery事件进行转换/计算/更新。度量单位选择被保存在该页面上的jQuery全局变量中。

通常的程序流程是供用户输入其规格和首选UOM。一旦表格值被输入/转换，它们就使用HTTP POST提交。具有简短细节的兼容产品列表以JSON格式从MVC控制器返回，并使用jQuery DataTable进行显示。

然后，用户可以选择将导致导航到不同的MVC视图显示大量的细节与可选附件，定价和航运选项一起指定产品的产品之一，等等

客户端已决定，他们当用户点击浏览器的后退/前进按钮时，希望保留这些表单域的状态。这对我来说似乎是一项艰巨的任务。我知道使用ASP.NET会话变量，但我想问开发人员社区实现这种功能的优点/缺点，并推荐使用哪些方法。

来源

2015-01-20 rwkiii

Cookie可能更受欢迎，因为它存储在客户端，可以通过javascript读取/写入。如果用户使用后退按钮，则服务器有可能再次被击中，页面只会从浏览器缓存中加载。但是，JavaScript仍然会执行并能够为这些字段提取Cookie值。 – Tommy 2015-01-20 18:38:20

@Tommy HTML5是否实现了保存表单数据的功能？并且由于ASP使用cookie来保存会话变量，这可能会起作用吗？或者你是否建议在客户端使用jQuery保存cookie？对不起，我从来没有遇到过像这样保存复杂表单数据的挑战。 – rwkiii 2015-01-20 18:54:26

ASP使用cookie来存储会话标识，而不是存储在服务器内存中的会话值。至于HTML 5，他们可能有，但由于我的大多数应用程序仍需要支持IE8等传统浏览器，所以我没有太多使用这些新功能的经验。顺便说一下，您可以从客户端和服务器端创建/编辑Cookie。客户端无法直接访问会话变量，因为它们存储在服务器上。 – Tommy 2015-01-20 18:59:27

这是一个使用浏览器sessionStorage的解决方案。

在您的形式通过调用 StoreFormValues($(#MyFormId"), "MyFormName")

当加载你的页面检查，如果网页透过后退按钮导航到，如果是恢复所有表单数据的提交按钮（或事件）存储所有的表格数据。

if (performance.navigation.type == 2) { // 2 means page was accessed by navigating into the history (Browser Back Button) 
    RestoreFormValues($("#MyFormId"), "MyFormName"); 
} 

function RestoreFormValues(form, name) { 
    form.find(':input:visible').not(':input[type=button], :input[type=submit], :input[type=reset]').each(function() { 
     var value = sessionStorage.getItem(name + $(this).prop('id')); 
     if (value) 
      $(this).val(value); 
    }); 
} 

function StoreFormValues(form, name) { 
    form.find(':input:visible').not(':input[type=button], :input[type=submit], :input[type=reset]').each(function() { 
     sessionStorage.setItem(name + $(this).prop('id'), value = $(this).val()); 
    }); 
}

MyFormName只是一个名称，用于在会话存储中唯一地加前缀字段名称。

来源

2018-01-02 17:02:14 RitchieD

保留表单字段和jQuery VAR值时，浏览器后退按钮点击

回答

相关问题