javascript在提交表单时异步检验多项内容

window.open('http://v.t.sina.com.cn/share/share.php?title=' + txt + '→来自页面"' + title + '"的文字片段&url=' + window.location.href);

转载:http://blog.csdn.net/seacean2000/article/details/7912246

重点看一下js代码是怎么设计的。

window.onload = initPage;//初始化加载
var usernameValid=false;//检查用户名的有效性标记
var passwordValid=false;//检查密码的有效性标记
 
function initPage() {
  document.getElementById("username").onblur = checkUsername;//加载同户名的检查
  document.getElementById("password2").onblur=checkPassword;//加载密码的检查
  document.getElementById("register").disabled = true;//禁用注册按钮
  document.getElementById("register").onclick=registerUser;//加载注册按钮处理事件程序
}
 
function checkUsername() {//异步发送用户名
  document.getElementById("username").className = "thinking";
  usernameRequest = createRequest();
  if (usernameRequest== null)
    alert("Unable to create request");
  else {
    var theName = document.getElementById("username").value;
    var username = escape(theName);
    var url= "checkName.php?username=" + username;
    usernameRequest.onreadystatechange = showUsernameStatus;
    usernameRequest.open("GET", url, true);
    usernameRequest.send(null);
  }
}
 
function showUsernameStatus() {
  if (usernameRequest.readyState == 4) {
    if (usernameRequest.status == 200) {
      if (usernameRequest.responseText == "okay") {//检查成功,将用户名有效性标记改为true
        document.getElementById("username").className = "approved";
        usernameValid = true;
      } else {
        document.getElementById("username").className = "denied";
        document.getElementById("username").focus();
        document.getElementById("username").select();
        passwordValid= false;
      }
      checkFormStatus();//检查表单的有效性
    }
  }
}
 
function checkPassword(){
    var password1=document.getElementById("password1");
    var password2=document.getElementById("password2");
    
    password1.className="thinking";
    
    if(password1.value==""||(password1.value!=password2.value)){//两次密码不一致的处理
        password1.className="denied";
        passwordValid=false;
        checkFormStatus();
        return;
    }
    
     passwordRequest=createRequest();
    if(passwordRequest==null){
        alert("Unable to create request");
    }else{
        var password=escape(password1.value);
        var url="checkPass.php?password="+password;
        passwordRequest.onreadystatechange=showPasswordStatus;
        passwordRequest.open("GET",url,true);
        passwordRequest.send(null);
    }
}
 
function showPasswordStatus(){
    if(passwordRequest.readyState==4){
        if(passwordRequest.status==200){
            var password1=document.getElementById("password1");
            if(passwordRequest.responseText=="okay"){
                password1.className="approved";
                passwordValid=true;
            }else{
                password1.className="denied";
                password1.focus();
                password1.select();
                passwordValid=false;
            }
            checkFormStatus();
        }
    }
}
 
function checkFormStatus(){
    if(usernameValid&&passwordValid){
        document.getElementById("register").disabled=false;
    }else{
      document.getElementById("register").disabled=true;  
    }
}
 
function registerUser(){
    t=setInterval("scrollImages(),50");
    document.getElementById("register").value="Processing......";
    registerRequest=createRequest();
    if(registerRequest==null){
        alert("Unable to create request");
    }else{
        var url="register.php";
        registerRequest.onreadystatechange=registerationProcessed;
        registerRequest.open("GET",url,true);
        registerRequest.send(null);
    }
}
 
function registerationProcessed(){
    if(registerRequest.readyState==4){
        if(registerRequest.status==200){
            document.getElementById("wrapper").innerHTML=registerRequest.responseText;
        }
    }
}
 
function scrollImages(){
    var coverBarDiv=document.getElementById("coverBar");
    var images=coverBarDiv.getElementsByTagName("img");
    for(var i=0;i<images.length;i++){
        var left=images[i].style.left.substr(0,images[i].style.left.length-2);
        if(left<= -86){
            left=532;
        }
        images[i].style.left=(left-1)+"px";
    }
}

 

posted @ 2017-11-06 09:20  五艺  阅读(158)  评论(0)    收藏  举报