html用户登录保存用户名,实例8-2 使用localStorage对象保存与读取登录用户名

1.功能描述

新建一个登录页面，用户在文本框中输入用户名与密码，单击“登录”按钮后，将使用localStorage对象保存登录时的用户名。如果选中“是否保存密码”选项，将保存登录时的密码，否则，将清空原先保存的密码。当重新在浏览器中打开该页面时，经过保存的用户名和密码数据，将分别显示在相应的文本框中。

2.实现代码

在DreamweaverCS5中新建一个HTML页面8-2.html，加入代码如代码清单8-2所示。

代码清单8-2 使用localStorage对象保存与读取登录用户名与密码

使用localStorage对象保存与读取登录用户名与密

登录

• 名称：

  type="text">

• 密码：

  type="password">

• 是否保存密码

• type="button" onClick="btnLogin_click();">

  type="reset" value="取消">

在代码清单8-2中，页面导入一个JavaScript文件js2.js,其中自定义两个函数，分别在页面加载和单击“登录”按钮时调用。其实现的代码如下所示：

//JavaScript Document

function $$(id){

return document.getElementByld(id);

}