Javascript HTML5存储不工作

Javascript HTML5存储不工作,javascript,html,local-storage,Javascript,Html,Local Storage,我正在将数据从当前页面转发到下一页,即,每当再次加载页面时,代码会检查是否存在此类存储,如果存在,则会在文本框中加载值。我无法让它工作,下面是代码- <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title></title> <script type="te

我正在将数据从当前页面转发到下一页,即,每当再次加载页面时,代码会检查是否存在此类存储,如果存在,则会在文本框中加载值。我无法让它工作,下面是代码-

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript">
    function values()
    {
        if(localStorage.getItem(pranav))
        {
            document.getElementById(FName).innerText= sessionStorage.getItem(pranav);
           document.getElementById(OName).innerText= sessionStorage.getItem(k);
        }
        else
        {
            sessionStorage.setItem("pranav", "P");
            sessionStorage.setItem("k", "P");
            return;
        }
    }
</script>

</head>

<body>
<form name="myform" action="Idea.html" onload="values(this.form)">
    <label>Please Enter Your Full Name = </label><input type="text" name="FName" id="FName" />
    <label>Please Enter Your Current Organization</label><input type="text" name="OName" id="OName" />
    <input type="submit" value="Submit" onclick="values(this.form)" />
</form>

</body>
</html>

函数值()
{
if(localStorage.getItem(pranav))
{
document.getElementById(FName).innerText=sessionStorage.getItem(pranav);
document.getElementById(OName.innerText=sessionStorage.getItem(k);
}
其他的
{
sessionStorage.setItem(“pranav”、“P”);
sessionStorage.setItem(“k”、“P”);
返回;
}
}
请输入您的全名=
请输入您当前的组织

请帮助我解释为什么这不起作用?

您尚未声明所使用的
pranav
k
变量。此外,在为输入字段赋值时,应使用
.value
属性,而不是
.innerText

也可以考虑在2个函数中拆分代码:

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script type="text/javascript">
    function loadValues() {
        var data = localStorage.getItem('data');
        if(data) {
            data = JSON.parse(data);
            document.getElementById('FName').value = data.firstName;
            document.getElementById('OName').value = data.lastName;
        }
    }

    function saveValues() {
        var data = {
            firstName: document.getElementById('FName').value,
            lastName: document.getElementById('OName').value
        };
        localStorage.setItem('data', JSON.stringify(data));
    }
    </script>
</head>
<body onload="loadValues()">
    <form name="myform" action="Idea.html" onsubmit="saveValues()">
        <label>Please Enter Your Full Name = </label>
        <input type="text" name="FName" id="FName" />
        <label>Please Enter Your Current Organization</label>
        <input type="text" name="OName" id="OName" />
        <input type="submit" value="Submit" />
    </form>
</body>
</html>

函数loadValues(){
var data=localStorage.getItem('data');
如果(数据){
data=JSON.parse(数据);
document.getElementById('FName')。value=data.firstName;
document.getElementById('OName')。value=data.lastName;
}
}
函数saveValues(){
风险值数据={
名字:document.getElementById('FName')。值,
lastName:document.getElementById('OName').value
};
setItem('data',JSON.stringify(data));
}
请输入您的全名=
请输入您当前的组织

在第一次调用
时,键“pranav”应该用引号括起来。getItem()
刚刚尝试了这一点,但JavaScript并没有在页面重新加载或单击提交按钮时自动更改文本框值。您可能想将其分为两个函数:一个是在调用socument时调用的函数(body onload)以及在提交表单时调用的。我已经用一个例子更新了我的答案。我用XAMPP和我所有的浏览器(包括Chrome、Waterbox和IE)尝试了这段代码,但当页面刷新时,什么都没有发生。文本字段的值不会在加载时自动填充?您需要首先提交表单,以便将值存储在localstorage中。我还犯了一个小错误,将
onsubmit
属性放在按钮上,而它本应该放在表单上。我现在更新了我的答案。确保您使用的代码如图所示。情况要好得多,JS在表单提交时正在文本字段中加载未定义的内容。谢谢(顺便说一句:)