我正在利用空闲时间设计一段代码，这有点非正统，所以请耐心等待。页面设置为运行各种页面，基于从哪个"标记读取html。我只是在寻找一种方法，将多个页面压缩成一个页面，这似乎很有趣。如果你们知道更好的方法，任何信息都将不胜感激。
到目前为止，我已经设法让一切正常工作，直到我遇到一个部分，我试图获得一个表单值，将其分配给一个全局变量，然后使用脚本在文本中打印全局变量。在这种情况下，它会询问用户的名字，目的是在整个网站的各个地方复制这个名字，以获得更用户友好的感觉。我想了解这一点在未来会很有用。最终，我想知道如何创建一个包含用户名和密码以及所有这些好东西的数据库，但目前，我只是在寻找一个简单的解决方案。我可能错过了一些基本的东西。这是代码：
<head>
<style>
body {
margin: 0 auto;
background-image: URL('http://fc04.deviantart.net/fs9/i/2006/033/2/c/Matrix_code_by_phi_AU.jpg');
background-attachment: fixed;
background-repeat: repeat-y;
}
</style>
<meta charset="utf-8">
<title>MasterCode</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>
var name = "";
//user is "finished typing," collect input
function doneTyping() {
name = document.getElementById('nameid').value;
closeElement('welcomepage');
closeElement('namepage');
showElement('homepage');
}
function closeElement(myelement) {
document.getElementById(myelement).style.display = "none";
}
function showElement(myelement) {
document.getElementById(myelement).style.display = 'block';
}
function enterWebsite() {
closeElement('namepage');
closeElement('homepage');
$("#dialog").dialog({
autoOpen: false
}, {
title: "Change"
}, {
resizable: false
});
$("#opener").click(function () {
$("#dialog").dialog("open");
closeElement('welcomepage');
showElement('namepage');
})
}
function writeName() {
document.write(name);
}
</script>
</head>
<body onload="enterWebsite()">
<div id="welcomepage">
<button id="opener" style='background: url("http://4.bp.blogspot.com/-fDgJmT5rzlM/Tq8SpW3ZcbI/AAAAAAAAA1I/l02iiclqKkA/s1600/tracking%2Bclub%2Bmeet%2B%2526%2BMisty%2BAlgonquin%2Bshots%2B106.jpg") no-repeat top left; color: #FFFFFF; height: 685px; width: 1350px; font: 75px helvetica, cursive'>Enter MasterCode</button>
</div>
<div id="namepage">
<form id='name_input'>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<center>
<input style="background-image:URL('https://waypointprod.blob.core.windows.net/blogfilestore/storage/blogs/headlines/2013/12/5/image.jpg');background-repeat:no-repeat;background-position: ; border: 50px solid black ; height:50px; width:350px; color: #FFFFFF; font: 45px helvetica, cursive;"
id='nameid' type="text" value="Enter your name.">
<br/>
<button id='submit_name' onclick='doneTyping(); return false;'>I Accept The Risks</button>
</form>
</div>
<div id="homepage">
<font size="25" color="white">
Welcome, <script> writeName(); </script>
</font>
</div>
</body>
</html>
想法？(编辑：按照tewathia的建议使用localStorage解决)
不确定您是否正在使用任何类型的RESTful API甚至nodejs。如果你是，我会做一些事情来防止将这些数据存储在cookie或sessionStorage中，那就是我利用服务器端进行存储。这样您就不需要在客户端添加那么多逻辑了。此用户数据可能是
{
"name": "Don Jon",
"favorite_color": "blue"
}
你甚至可以用蓝色显示页面的不同部分，以实现超级用户友好的