<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title></title>
<script type="text/javascript" src="js/jquery-3.1.0.min.js"></script>
<style>
body{
padding: 0px;
margin: 0px;
background-color: #E4E4E4;
}
.login_top{
width: 100%;
height: 150px;
}
.login_middle{
width: 100%;
height: 150px;
}
.login_input{
width: 100%;
height: 40px;
margin-top: -1px;
border: 0px;
font: 14px "微软雅黑" ;
outline: none;
}
.login_login{
width: 90%;
height: 40px;
margin: 10px 5% 0 5%;
border-radius: 5px;
border: 0px;
color: white;
background-color: #0000FF;
font: 14px "微软雅黑";
}
.login_forgetpwd{
position: fixed;
left: 0px;
bottom: 0px;
font: 12px "微软雅黑";
color: blue;
}
.login_regist{
position: fixed;
right: 0px;
bottom: 0px;
font: 12px "微软雅黑";
color: blue;
}
</style>
</head>
<body>
<div class="login_top">
<div id="login_errorshow" style="width: 100%;height: 43px;background-color: orange;">
<div style="width:100%;height: 9px;"></div>
<div id="login_errortext" style="width: 90%;height: 25px;text-align:center; font: 13px '微软雅黑'; color: white; margin: 0 5% 9px 5%;">
</div>
</div>
</div>
<div class="login_middle">
<input type="text" id="login_username" class="login_input" placeholder="用户名/手机号" />
<input type="password" id="login_userpwd" class="login_input" placeholder="密码" style="border-top: 1px solid #E4E4E4;"/>
<button id="login_button" class="login_login">登录</button>
</div>
<div id="login_bottom">
<div class="login_forgetpwd">
<a href="forgetpwd.html" class="login_forgetpwd" style="text-decoration: none;">忘记密码</a>
</div>
<div class="login_regist">
<a href="regist.html" class="login_regist" style="text-decoration: none;">注册</a>
</div>
</div>
</body>
<script type="text/javascript">
$("#login_errorshow").hide();
$("#login_button").click(function(){
var l_name=localStorage.getItem("username");
var l_pwd=localStorage.getItem("userpwd");
var login_name=$("#login_username").val();
var login_pwd=$("#login_userpwd").val();
if(l_name!=login_name){
$("#login_errorshow").show();
$("#login_errortext").html("用户名不存在！")
login_errorhide();
} else if(l_pwd!=login_pwd){
$("#login_errorshow").show();
$("#login_errortext").html("密码错误！")
login_errorhide();
}else{
window.location.href="homepage.html";
localStorage.setItem("zidongdenglu","yes");
}
});
function login_errorhide(){
setTimeout(function(){
$("#login_errorshow").hide();
},2000);
};
$(function(){
var flag=localStorage.getItem("zidongdenglu");
if(flag=="yes"){
if(localStorage.getItem("username")&&localStorage.getItem("userpwd")){
window.location.href="homepage.html";
}
}
});
//判断用户是否在输入，如果再输入就把下面的内容隐藏掉，不然会被键盘给顶起来
//这里固定的最下方的div会被键盘给顶上来，只能设置隐藏，但是如果隐藏了的话，
// 键盘不是失焦而关掉，而是点击键盘上的关闭而关闭的键盘就会出现div没有显示，最下方是空白的情况。求助怎么解决。
$("#login_username").focus(function(){
$("#login_bottom").hide();
});
$("#login_username").blur(function(){
$("#login_bottom").show();
});
$("#login_userpwd").focus(function(){
$("#login_bottom").hide();
});
$("#login_userpwd").blur(function(){
$("#login_bottom").show();
})
</script>
</html>
分享到：
相关推荐
基于双环控制的三相SVPWM逆变器研究的仿真有问题求助-threestandalone.mdl 参照相关文献，对基于双环的三相SVPWM逆变器独立运行的控制策略已经了解，系统采用LC滤波器，参数已选好。逆变器为三相半桥逆变器。控制...
以下是报错信息 索引超出数组元素的数目(5)。 出错 lmiunpck (line 16) ldt=lmisys(7); % length of DATA 出错 nnsetup (line 25) [LMI_set,LMI_var,LMI_term,data]=lmiunpck(lmisys); 出错 dbnunfoldtonn (line 10...
【大学生求助交流系统】是一个专为本科生设计的项目，旨在提供一个平台，让在校大学生能够进行学术交流、问题求助和资源共享。这样的系统对于促进学生之间的合作学习，提高学术研究能力，以及解决学业难题具有重要...
例如，在“郑州航院计算机学院学生学分问题求助信息登记表”中，通过合理布局各个字段（如姓名、学号、专业等），能够确保信息清晰且易于填写。 - **数据结构**：表单中的每一项都对应着一个特定的数据类型，例如...
(7)一般问题求助时都需要附上截图，如果截图不需要花钱的话，全屏截图，因为问题可能并 不在你截图的位置; (8)勤于练习，并结合工作中的实际应用; (9)从入门到放弃很正常，如果这并不是你的擅长所在，就没有必要...
Shopxp是一个经过完善设计的经典网上购物系统，适用于各种服务器...如果碰到问题，先检查一下本地的配置或到官方网站提交问题求助。 咨询热线：400-883-1122 QQ咨询：97003001 后台管理路径：admin/index.asp 用户名：
Shopxp购物系统历经多年的考验，并在推出...该系统经过全面测试完整可用，如果碰到问题，先检查一下本地的配置或到官方网站提交问题求助。网站管理地址：http://你的网址/admin/login.asp 用户名：admin 密 码：admin
Shopxp购物系统历经多年的考验，并在推出...该系统经过全面测试完整可用，如果碰到问题，先检查一下本地的配置或到官方网站提交问题求助。 网站管理地址：http://你的网址/admin/login.asp用户名：admin密 码：admin
该系统经过全面测试完整可用，如果碰到问题，先检查一下本地的配置或到官方网站提交问题求助。 网站管理地址：http://你的网址/admin/login.asp 用户名：admin 密 码：admin 本次更新说明： 网站版权所有可在...
Shopxp购物系统历经多年的考验，并在推出...该系统经过全面测试完整可用，如果碰到问题，先检查一下本地的配置或到官方网站提交问题求助。 网站管理地址：http://你的网址/admin/login.asp 用户名：admin 密 码：admin
Shopxp购物系统历经多年的考验，并在推出...该系统经过全面测试完整可用，如果碰到问题，先检查一下本地的配置或到官方网站提交问题求助。 网站管理地址：http://你的网址/admin/login.asp 用户名：admin 密 码：admin
Shopxp购物系统历经多年的考验，并在推出...该系统经过全面测试完整可用，如果碰到问题，先检查一下本地的配置或到官方网站提交问题求助。 网站管理地址：http://你的网址/admin/login.asp 用户名：admin 密 码：admin
该系统经过全面测试完整可用，如果碰到问题，先检查一下本地的配置或到官方网站提交问题求助。 网站管理地址：http://你的网址/admin/login.asp 用户名：admin 密 码：admin 本次更新说明： 1.网站版权所有可在...
该系统经过全面测试完整可用，如果碰到问题，先检查一下本地的配置或到官方网站提交问题求助。 网站管理地址：http://你的网址/admin/login.asp 用户名：admin 密 码：admin 本次更新说明： 1.上期版本...
该系统经过全面测试完整可用，如果碰到问题，先检查一下本地的配置或到官方网站提交问题求助。 网站管理地址：http://你的网址/admin/login.asp 用户名：admin 密 码：admin 本次更新说明： 1.解决会员收藏商品时...
该系统经过全面测试完整可用，如果碰到问题，先检查一下本地的配置或到官方网站提交问题求助。 网站管理地址：http://你的网址/admin/login.asp 用户名：admin 密 码：admin 本次更新说明： 1.上期版本中首页两...
该系统经过全面测试完整可用，如果碰到问题，先检查一下本地的配置或到官方网站提交问题求助。 网站管理地址：http://你的网址/admin/login.asp 用户名：admin 密 码：admin ShopXp网店系统 v3.20 更新： 1、...