Question

我在ajax中有这个函数，它接收服务器响应，但它没有输入第一个if：

function handleServerResponseForDesignations(ele){

        var attrName = ele.getAttribute("name");
        console.log("Attribute name : "+attrName);
        console.log("in handleServerResponseforDesignations");
        if(xmlHttp.readyState == 4){
            console.log("ready state is 4");
            if(xmlHttp.status == 200){
                var response2 = JSON.parse(xmlHttp.responseText);
                console.log("response2 : "+JSON.stringify(response2));
                if(response2.status == "200" || response2.status == 200){
                    var designations = response2.designations;
                    for(var i = 0; i< designations.length; i++){
                        var temp = designations[i];
                        var newoption = document.createElement("option");
                        newoption.value = temp.emp_id;
                        newoption.innerHTML = temp.designation;
                        if(attrName == "sender_department"){
                            console.log("inside sender_department if");
                            document.getElementById("sender_designation").options.add(newoption);
                        }
                        else if(attrName == "recipient_department"){
                            console.log("inside recipient_department if");
                            document.getElementById("recipient_designation").options.add(newoption);    
                        }                       
                    }
                    return true;    
                }
            }
            else{
                alert("Connection Problem ! ! !");
            }
        }       
    }

它正在控制台中打印，直到：“在handleServerResponseforDesignations中”但不会继续。我收到一个json作为响应，我在服务器端检查，发送的json是：'responseValue：{“status”：200，“指定”：[{"designation":"smm1","emp_id":"251235"},{"designation":"lpo","emp_id":"234567"}]}。

只要组合框发生变化，就会发生呼叫：

<select name="sender_department" id="sender_department" onchange="getDesignations(this)" disabled>
<option value="" disabled selected></option>
</select>

进行ajax调用的函数是：

        function getDesignations(ele){

        console.log("in getDesignations()");
        var val = ele.value;
        console.log("val is : "+val);
        if(xmlHttp.readyState == 0 || xmlHttp.readyState == 4){
            department = encodeURIComponent(val);
            if(department === null || department === ""){
                return false;
            }
            xmlHttp.open("GET","GetDesignations?department="+department,true);
            xmlHttp.onreadystatechange = handleServerResponseForDesignations(ele);
            xmlHttp.send(null);
        }
        else{
            setTimeout('getDesignations(ele)',1000);
        }

    }

在同一页面上有另一个功能正常工作。它也使用相同的ajax对象，但在不同的事件上。我正在使用Chrome浏览器。请帮忙！！

Answer 1

ajax请求是异步的，即响应稍后出现，似乎您正在立即调用handleServerResponseForDesignations函数。在http请求完成后，即成功（在您的情况下为200 / OK）或失败（某些HTTP错误代码），XMLHttpRequest实现将调用回调方法：onreadystatechange。就绪状态发生变化时，您将获得http响应和响应代码。
  改变你的功能如下，它应该工作：

    function handleServerResponseForDesignations(ele, xmlHttp) {

    var attrName = ele.getAttribute("name");
    console.log("Attribute name : " + attrName);
    console.log("in handleServerResponseforDesignations");

    if (xmlHttp.readyState == 4) {
        console.log("ready state is 4");
        if (xmlHttp.status == 200) {
            var response2 = JSON.parse(xmlHttp.responseText);
            console.log("response2 : " + JSON.stringify(response2));
            if (response2.status == "200" || response2.status == 200) {
                var designations = response2.designations;
                for (var i = 0; i < designations.length; i++) {
                    var temp = designations[i];
                    var newoption = document.createElement("option");
                    newoption.value = temp.emp_id;
                    newoption.innerHTML = temp.designation;
                    if (attrName == "sender_department") {
                        console.log("inside sender_department if");
                        document.getElementById("sender_designation").options.add(newoption);
                    } else if (attrName == "recipient_department") {
                        console.log("inside recipient_department if");
                        document.getElementById("recipient_designation").options.add(newoption);
                    }
                }
                return true;
            }

        } else {
            alert("Connection Problem ! ! !");
        }
    }
}

    function getDesignations(ele) {

    console.log("in getDesignations()");
    var val = ele.value;
    console.log("val is : " + val);
    xmlHttp = new XMLHttpRequest();
    department = encodeURIComponent(val);
    if (department === null || department === "") {
        return false;

        xmlHttp.onreadystatechange = function(){
           handleServerResponseForDesignations(ele, xmlHttp);
        }
        xmlHttp.open("GET", "GetDesignations?department=" + department, true);

        xmlHttp.send(null);
    } else {
        setTimeout('getDesignations(ele)', 1000);
    }

}

ajax - 请求对象readyState不更改

1 个答案: