页面、 ajax 、mock
页面1：
//html
<form action = "" method="post" name="loginForm">
<p>
<label for = "username">用户名：</label>
<input type="text" name="username">
</p>
<p>
<label for = "password">密码：</label>
<input type="text" name="password">
</p>
<p>
<input type="button" name="login" class=“loginBtn”>
</p>
</form>
<script src="./mock.js"></script>
<script src="./tools.js"></script>
<script src="./server.js"></script>
//js
const loginBtn=document.querySelctor(".loginBtn")
;loginBtn.onclick=function(){
let username= document.loginForm.username.value;
let possword= document.loginForm.possword.value;
let user{username, password};
ajax({
url:"studentSystem/users/login",
type:"post",
success(data){
let isLogin = JOSN.parse(data);
if (isLogin ){
alert("恭喜你，登录成功！")；
}else{
alert("不好意思，登录失败")；
}
}
});
}
//页面2
//server.js
let arr=[//假的数据库
｛username:"zs",password:"123"｝,
｛username:"ls",password:"456"｝
];
Mock.mock( / users \ / login , "post" , function({ body})){// 正则表达式，匹配URL网址 url:"studentSystem/users/login",
//假的服务器
//searchStrToObj获取用户输入的字符串分解
let user=searchStrToObj(body);
let isLogin = arr.some( v=> v.username == user.username && v.password == user.password );
return isLogin；
});//等同于后面
if(isLogin){//成功
return true；
}else{//失败
return false；
}
}}
最新文章
- October 31st Week 45th Monday 2016
- [ASP.NET Web API]如何Host定义在独立程序集中的Controller
- nginx:413 Request Entity Too Large 及 修改 PHP上传文件大小配置
- 适配布局-ios
- 成员资格、授权 – ASP.NET MVC 4 系列
- 【转】scp 命令格式
- 怎样给WordPress分配更多的内存
- C++ Primer : 第十四章 : 重载运算与类型转换之重载运算符
- ChatForFun 公众号使用说明
- Express细节探究(1)——app.use(express.static)
- asp.net <% %>,<%# %>,<%= %>,<%$ %>区别大集合
- Java学习----有风险的代码(异常)
- li的border无法和上边对齐
- 【hihoCoder第十五周】最近公共祖先·二
- Linux学习之进程管理
- Python之路-Linux命令基础（5）
- C#, VB.NET如何加密PDF文档
- unittest各个组件之间的关系
- Bitmap每个像素值由指定的掩码决定
- C#读取Excel表格的数据