先介绍下登录过程,然后介绍代码如何做。
登录过程
下面这个页面是起始页面,因为我已经测试过了,所以这里会显示我的用户名

点击按钮跳转到登录页面,输入用户名,密码,然后点击登录(注意这里我们的用户名是:segment)
页面会跳转到起始页面,并且会显示我们刚才的用户名
起始页面设计--goTo-demo.html
主要代码如下:
登录返回后下面显示你的登录用户名
点击跳转登录
当前用户名是:
var username = document.getElementById("username");
window.onload = function(){
if(localStorage.username.length>1){
username.innerHTML = localStorage.username; //给标签加用户名
}
}
function login(){
// 构造返回链接
var returnUrl = "returnUrl=goTo-demo.html";
var Url = "goToLogin-demo.html" + "?" + returnUrl;
location.href = Url;
}
登录页面设计--goToLogin-demo.html
主要代码如下:
页面登录
用户名:
密 码:
登录
function login(){
var username = document.getElementById('username').value;
var password = document.getElementById('password').value;
// 用户名和密码都不为空
if(username&&password){
localStorage.username = username;
var url = location.search.split("=")[1];
location.href = url; //从地址栏获取返回地址,实现跳转
}
}