popState 是点击浏览器的返回按钮就会触发,如果有push数据,就会在事件中获得state数据,里面就是pushState的第一个参数里的数据.
为了做微信的单页面结构,使用了这些功能,对一些需要特殊操作的链接进行接管,点击这类链接就用pushState插入历史记录,并修改地址栏,然后用ajax获取链接的内容添加到document中去,接着隐藏当前的内容块,显示新获取的内容块.
因为本身ajax获取内容并不会引起历史记录的变化,所以用户本能的点击返回按钮想回退到上一个内容页的时候,会无效,所以这里需要用pushState填入返回需要的数据,并自己在popState里处理对应的隐藏现在的内容块,显示上一个内容块的操作.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>
<head>
<title></title>
</head>
<body>
用户:<input id="uname" type="text" /><br />
密码:<input id="pwd" type="password" /><br>
确认密码:<input id="pwd1" type="password" /><br>
EMAIL:<input id="email" name="email" type="email" /><br>
<input id="load" value="登陆" type="button" onclick="check()" />
<script language="javascript">
window.onload = function ()
{
document.getElementById('uname').focus()
}
function check()
{
var uname=document.getElementById("uname").value
var pwd=document.getElementById("pwd").value
var pwd1=document.getElementById("pwd1").value
var email=document.getElementById("email").value
if(uname+pwd=="")
{
alert("用户名和密码不能为空")
}
else if(uname=="")
{
alert("用户名不能为空")
}
else if(pwd=="")
{
alert("密码不能为空")
}
else if(pwd1 != pwd)
{
alert("两次密码不一样")
}
//
if(email=="")
{
alert("电子邮件不能为空")
return false
}
else
{
reg=/^([a-zA-Z0-9]+[_|\-|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\-|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/gi
if(!reg.test(email))
{
alert("非法的电子邮件")
return false
}
}
}
</script>
</body>
</html>
