在学习中学到的一点AJax / JQuery 的小皮毛。随笔记下来了。
在我做的网站中用于用户注册的时候,验证邮箱/用户名、密码、昵称.....的合法正确性。
需要装入jquery-1.2.6.download.js后使用。看代码,多指教:
<HEAD>
<mce:script type="text/javascript"
src="<%=basePath%><!--
js/jquery-1.2.6.download.js">
// --></mce:script>
<mce:script type="text/javascript"><!--
//判断邮箱是否为空、格式是否正确
var flagCheckEmail=false;
function checkEmail()
{
var emailObj = $("#email"); //取到id="email"的组件对象
var emailValue = emailObj.val(); //取组件对象的value
var e_hintObj=$("#e_hint");
if(emailValue.search(/^/w+((-/w+)|(/./w+))*/@[A-Za-z0-9]+((/.|-)[A-Za-z0-9]+)*/.[A-Za-z0-9]+$/) != -1)
{
e_hintObj.html("<font color='red'>格式正确</font>");
checkEmailExist();
}else{
e_hintObj.html("<font color='red'>格式错误</font>");
flagCheckEmail=false;
}
}
function checkEmailExist()
{
var emailObj=$("#email");
var emailValue=emailObj.val();
$.get("<%=basePath%>servlet/CheckEmailServlet?checkEmail="+ emailValue, null, handlerRequest);
}
function handlerRequest(data) {
var e_hintObj = $("#e_hint");
if (/true/.test(data)) {
e_hintObj.html("<font color='red'>该邮箱已注册</font>");
flagCheckEmail = false;
} else {
e_hintObj.html("<font color='red'>恭喜,可以使用的邮箱</font>");
flagCheckEmail = true;
}
}
//判断密码是否为空
var flagcheckpwd = false;
function checkPwd() {
var pwdObj = $("#password"); //取到id="password"的组件对象
var pwdValue = pwdObj.val(); //取组件对象的value
var p_hintObj = $("#p_hint"); //取span中的p_hint
if (pwdValue == "") {
p_hintObj.html("<font color='red'>密码不能为空</font>");
flagcheckpwd = false;
} else {
p_hintObj.html("<font color='red'>填写正确</font>");
flagcheckpwd = true;
}
}
//判断用户昵称是否为空
var flagchecknickname = false;
function checkNickname() {
var nickNameObj = $("#name"); //取到id="name"的组件对象
var nickNameValue = nickNameObj.val(); //取组件对象的value
var n_hintObj = $("#n_hint"); //取span中的n_hint
if (nickNameValue == "") {
n_hintObj.html("<font color='red'>用昵称不能为空</font>");
flagchecknickname = false;
} else {
n_hintObj.html("<font color='red'>格式正确</font>");
flagchecknickname = true;
}
}
//添加按钮点击事件
//方法1
function save() {
checkEmail();
if (flagCheckEmail) {
checkPwd();
if (flagcheckpwd) {
checkNickname();
if (flagchecknickname) {
document.lzform.submit();
}
}
}
}
//方法2
/*function save(){
checkEmail();
checkPwd();
checkNickname();
if(flagCheckEmail&flagcheckpwd&flagchecknickname){
document.lzform.submit();
}
}*/
// --></mce:script>
</HEAD>