云笔记的项目分析(1):基本登录 前台验证

登录页面的处理:

引入:util.js  判断参数是否为空


/**
 * 判断参数是否为空
 * @param str
 * @returns {Boolean}
 */
function isEmpty(str){
	if (str == null || str.trim() == "") {
		return true;
	}
	return false;
}

/**
 * 判断参数是否不为空
 * @param str
 * @returns {Boolean}
 */
function isNotEmpty(str){
	if (str == null || str.trim() == "") {
		return false;
	}
	return true;
}

云笔记的项目分析(1):基本登录 前台验证

jqery以及config.js,用于验证用户登录

<form>
	        <div class="box show">
	        	<input type="text" class="user yahei16" id="userName" value="" /><br /><br />
	            <input type="password" class="pwd yahei16" id="userPwd" value="" /><br /><br />
	            <input id="rem" type="checkbox"  class="inputcheckbox"/> <label>记住我</label>&nbsp; &nbsp; 
	            <span id="msg" style="color: red"></span><br /><br />
	            <input type="button" class="log jc yahei16" value="登 录" onclick="checkLogin()" />&nbsp; &nbsp; &nbsp; 
	            <input type="reset" value="取 消" class="reg jc yahei18" />
			</div>
		</form>

用form标签,设置取消按钮为type=reset ,点击会重置信息

登录按钮的checkLogin()事件

1.获取用户名和密码

2.判断是否输入空

3.发送ajax请求

function checkLogin() {	
		// 1、得到用户名和密码
		var userName = $("#userName").val();
		var userPwd = $("#userPwd").val();
		// 2、判断用户名称和密码,为空显示提示信息
		if (isEmpty(userName)) {
			$("#msg").html("* 用户名称不能为空!");
			return;
		}
		$("#msg").html("");
		
		if (isEmpty(userPwd)) {
			$("#msg").html("* 用户密码不能为空!");
			return;
		}
		$("#msg").html("");
		
		// 判断是否记住密码
		var rem = 0; // 不选中
		if ($("#rem").prop("checked")) { // 选中
			rem = 1;
		}
		
		// 发送ajax请求
		$.ajax({
			url:"user",
			type:"post",
			data:{action:"login",userName:userName,userPwd:userPwd,rem:rem},
			dataType:"json",
			success:function(result) {
				console.log(result);
				// 判断是否登录成功 code=1成功,code=0失败
				if (result.code == 1) {
					// 跳转到首页
					window.location.href = "index";
				} else {
					$("#msg").html(result.msg);
				}
			}
		});
		
	}

val获取input里面的value值

.prop:返回的是true或者false 设置记住密码按钮input属性为checkbox prop("checked")选中rem为1

三个值都获取到了,发送ajax请求

ajax的格式:

$.ajax({

url:servlet的路径

type:请求方式,get/post

data:{获取值的键值对}

success:成功后返回的方法function(返回的结果参数){

判断是否成功:

成功window.location.href="" 
}

})

上一篇:MongoDB远程定时备份与还原


下一篇:mysql定时备份