登陆功能
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
开发工具与关键技术:Visual Studio
作者:黄海浪
撰写时间:2019年5月27日
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
想要实现登陆功能首先要获取账号和密码,还有验证码,还要判断是否填写完整,然后通过查询判断验证码是否正确,判断是否存在这个账号,如果有又要判断密码是否正确,如果有记住用户和密码这个功能又要通过Cookie来实现
JS代码:$("#btnSubmit").click(function () {
//获取值
var UserNuber = $('#fmLogin [name="UserNuber"]').val();
var password = $('#fmLogin [name="password"]').val();
var validCode = $('#fmLogin [name="validCode"]').val();
var UserTypeClass = $('#fmLogin [name="UserTypeClass"]').val();
var rememberMe = $('#fmLogin [name="rememberMe"]:checked').val();
//判断是否填写数据
if (strValIsNotNull(UserNuber) && strValIsNotNull(password) && strValIsNotNull(validCode)) {
$.post("/Main/UserLogin",
{
UserNuber: UserNuber,
password: password,
validCode: validCode,
UserTypeClass: UserTypeClass,
rememberMe: rememberMe,
}, function (msg) {
if (msg == "success") {
// alert("登陆成功");
//跳转到主页面
window.location.replace("/Main/Main");
} else {
if (msg == "userTypeErro") {
alert('请选择正确的用户类型');
}
else if (msg == "passwordErro") {
alert('请输入正确的账号或密码');
}
else if (msg == "validCodeErro") {
alert('请输入正确的验证码');
}
else if (msg == "userNoExsit") {
alert('用户不存在');
}
else {
alert('登录失败');
}
//清空密码和验证码
$("#password").val("");
$("#validCode").val("");
//验证码刷新
$("#validCodeImg").click();
}
});
}
});
$("#validCodeImg").click(function () {
$(this).prop("src", "/Main/CreateValidCodeImage?t=" + new Date().getTime());
});
我们知道验证码是可以换的,有些验证码看不清是可以点击换一张的,所以上面这个点击事件就是用来刷新验证码的,只要porp里面的路径每次点击都不一样就行了,所以后面给它加个当前点击时间
控制器代码截图:
看到图片上的代码就是获取页面传递过来的变量然后通过查询和数据库里面的数据一条一条的对比判断,验证码是和session中拿到的验证码对比,判断成功之后还要把用户数据放到session中,判断有没有设置记住用户信息这个功能,有就记住,没有就忘记