javascript - ajax调用后readyState的值为2

Question

ajax代码

var xmlhttp;

function trim(str){
    var t = str.replace("/(^\s*)|(\s*$)/g", "");
    return t.replace("/(^ *)|( *$)/g","");
}

function createXMLHttpRequest(){
    if(window.ActivrObject){
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }else if(window.XMLHttpRequest){
        xmlhttp = new XMLHttpRequest();
    }
}

function validateform(){
    var nickname = document.form1.nickname.value;
    var pass = document.form1.pass.value;
    var confirmpass = document.form1.confirmpass.value;
    var email = form1.email.value;

    var dataStr="nickname="+nickname+"&pass="+pass+"&confirmpass="+confirmpass;
    var url = "/ajax/servlet/ValidForm";

    createXMLHttpRequest();
    xmlhttp.open("POST", url, true);
    xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
    xmlhttp.send(dataStr);
    xmlhttp.onreadystatechange=callback;
}

function callback(){
    if(xmlhttp.readyState==4&&xmlhttp==200){
        var s = admin;
        if(trim(s) == 1){
            alert("注册成功");
        }
        if(trim(s) == 2){
            var tip = "该名称已经存在!";
            document.getElementById("nicknamelabel").innerHTML = tip;
            form1.nickname.value = "";
        }
        if(trim(s)==0){
            alert("产生异常");
        }
    }else{
        console.debug(xmlhttp);
        console.debug(xmlhttp.readyState);
        console.debug(xmlhttp.status);
    }
}

//长度限制
function checkpass(pass){
    var result = pass.match("^\w+$ ");//数字,字母,下划线
    if(result == null){
        return false;
    }else{
        return true;
    }
}

function checkemail(email){
    var re = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
//  var result = email.match(re);
    if(re.test(email)){
        return true;
    }else{
        return false;
    }
}

function validate_form(){
    if(form1.nickname.value == ""){
        alert("昵称不能为空!");
        return false;
    }
    if(form1.pass.value == ""){
        alert("密码不能为空!");
        return false;
    }
    if(form1.confirmpass.value == ""){
        alert("确认密码不能为空!");
        return false;
    }
    if(form1.confirmpass.value != form1.pass.value){
        alert("确认密码不相等");
        return false;
    }

    if(checkemail(form1.email.value) == false){
        alert("email 不合法!");
        return false;
    }

    return true;
}

function reg(){
    if(validate_form() == false)
        return false;
    validateform();
}

后端java代码

package com.dh.service;

import java.sql.ResultSet;
import java.sql.SQLException;

import com.dh.dao.SqlDao;

public class ValidateService {

    private SqlDao db = new SqlDao();
    private ResultSet rs = null;

    public int validateNickName(String nickName){
        String sql = "select * from user where nickName = '"+nickName+"'";
        int flag = 0;
        rs = db.executeQuery(sql);
        try {
            if(rs.next())
                flag = 1;
        } catch (SQLException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
        return flag;
    }
}

github地址

https://github.com/adolphlwq/problems

报错信息

ps

1. 在chrome和火狐调试readyState的值都是2

Answer 1

问题解决:

1. XHR的每一个方法都会写到网络流,但是只有在send()方法后HXR才会开启连接.所以XHR的方法要有一定的顺序.onreadystatechange()方法在send()方法之前.

2. if(xmlhttp.readyState==4&&xmlhttp==200)应该写成if(xmlhttp.readyState==4&&xmlhttp.status==200) ,代码主要是参考书本的,书本比较老了,需要改版.

3. 参考链接