在刷新之前存储元素中的数据
Storing data from elements before a refresh
我有一个包含3个元素的网页,用户将在其中输入文本值,然后按下按钮。在提交时,它将处理并返回一些要在表中填充的值。
这部分工作正常。
现在,如果用户刷新页面,所有数据都会消失,3个元素和表看起来都是空的。
我想这样做。捕获刷新事件并将3个用户输入的值存储在本地存储器中,当页面被加载时,我会将其发送回控制器以再次填充表。
这样做可能吗?我对网络开发还很陌生,而且已经没有什么想法了。
这就是我尝试过的。这是行不通的。
window.onbeforeunload = function() {
localStorage.setItem(name, $('#name_field').val());
localStorage.setItem(id, $('#id_field').val());
localStorage.setItem(pw, $('#pw_field').val());
alert("am here")
}
window.onload = function() {
var name= localStorage.getItem(name);
if (name != null) $('#name_field').val(name);
var id= localStorage.getItem(id);
if (id!= null) $('#id_field').val(id);
var pw= localStorage.getItem(pw);
if (pw!= null) $('#pw_field').val(pw);
}
我永远无法在窗口中获得警报。onbeforeload函数弹出。
您每次都可以将其存储在本地存储(或事件会话存储,我认为这对您的情况更好)。然后,每次您在存储中查找该值时。如果发现任何值,则将其发送到控制器。
如果是我,我会按照上面所说的那样,将您的数据保存到sessionStorage
中(这意味着如果用户关闭选项卡/浏览器,数据将丢失):
var saveData = function()
{
var data =
{
id: $("#id_field").val(),
name: $("#name_field").val(),
pw: $("#pw_field").val()
};
sessionStorage.setItem("formValues", JSON.stringify(data));
}
Idk您的帖子是否异步。如果它是异步的,您可以在successCallback上调用该函数;如果它不是异步的,则在submit事件上调用它。
然后在ready
事件中,您可以读取该数据:
$(document).ready(function()
{
var data = sessionStorage.getItem("formValues");
// Check if there is any user data already saved
if (data)
{
data = JSON.parse(sessionStorage.getItem("formValues"));
$("#id_field").val(data.id);
$("#name_field").val(data.name);
$("#pw_field").val(data.pw);
}
});
我更喜欢将对象中的一组数据存储在存储器上的单个键中,这就是为什么我使用JSON
来字符串化和解析对象,因为存储器只接受字符串类型。
一个简单的建议:永远不要存储密码,让用户输入。出于安全考虑。
相关文章:
- 基于数据元素限制动态表单字段
- 为什么DTM数据元素被调用两次
- 方法来使用jQuery选择匹配的数据元素
- 访问jQuery中的SVG数据元素
- Ajax 数据元素未拾取
- 从 json 字符串中提取数据元素
- Jquery验证插件,使用选项的数据元素作为验证检查
- 未捕获的异常:每个数据元素都必须实现一个唯一的“id”属性slick.dataview.js
- Knockout foreach 循环迭代相同的数据元素
- 从数据表重新加载 javascript 数据元素 asp.net 而不重新加载页面
- 如何从html中删除数据元素
- 使用jquery从HTML5数据元素中获取并执行函数+参数
- 按属性选择d3.js数据元素
- jQuery过滤器不返回数据元素,只返回整个对象
- 添加< >标记在选择的enter()部分的主数据元素之前
- 为数据元素设置一个变量
- 在javascript中转义数据元素中的撇号
- 如何访问CSV文件的数据元素
- 在adobedtm数据元素中寻找自定义脚本
- 问题更新Adobe分析变量通过数据元素在动态标签管理器- DTM