最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - onreadystatechange function not being called - Stack Overflow

programmeradmin4浏览0评论

For some reason, onreadystatechange call back function is not being called in asynchronous mode. I tested the post in synchronous mode and confirmed that post itself is working fine (mented out testing code I used to check post in synchronous mode). The problem occurs both in safari and firefox latest version. Can someone please tell me what I am doing wrong here? Thank you.

    <html>
    <head>
    <script>
    function recordScore(str)
    {

    if (str.length==0)
    { 

        return;
    }

    xmlHttp=GetXmlHttpObject();
    if (xmlHttp==null)
    {
        alert ("Your browser does not support AJAX!");
        return;
    } 

    var url="";
    var params = "screenname="+document.getElementById("screenname1").value+"&score="+document.getElementById("score1").value;
    alert("params: "+params);
    xmlHttp.open("POST",url,true);

    xmlHttp.onreadystatechange = function() 
    {
        alert("entered call back function. readstate value is: "+xmlHttpreadyState+". Response Text is: "+xmlHttp.responseText);

    if (xmlHttp.readyState==4)
    { 
        document.getElementById("message").innerHTML=xmlHttp.responseText;
    }
    }
    xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded")
    xmlHttp.send(params);

    //Testing code for synchronous mode
    //alert("Http get status is: "+xmlHttp.status);
    //alert("Http ready state value is: "+xmlHttp.readyState);
    //alert("Http get response text is: "+xmlHttp.responseText);
    //document.getElementById("message").innerHTML=xmlHttp.responseText;
    }


    function GetXmlHttpObject()
    {
        var xmlHttp=null;
        try
        {
            // Firefox, Opera 8.0+, Safari
            xmlHttp=new XMLHttpRequest();
        }
        catch (e)
        {
            // Internet Explorer
            try
            {
                xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
            }
            catch (e)
            {
                xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
        }
        return xmlHttp;
    }

    </script>


    </head>


    <body>

    <form name="testform">
        Screename: 
        <input type="text" id="screenname1" name="screenname">
        <br/>
        Score:
        <input type="text" id="score1" name="score" onchange="recordScore(this.value)"> 
        <br/>
        <p id="message">test</p>

        <input type="submit" value="Submit">
    </form>

    </body>


    </html>

For some reason, onreadystatechange call back function is not being called in asynchronous mode. I tested the post in synchronous mode and confirmed that post itself is working fine (mented out testing code I used to check post in synchronous mode). The problem occurs both in safari and firefox latest version. Can someone please tell me what I am doing wrong here? Thank you.

    <html>
    <head>
    <script>
    function recordScore(str)
    {

    if (str.length==0)
    { 

        return;
    }

    xmlHttp=GetXmlHttpObject();
    if (xmlHttp==null)
    {
        alert ("Your browser does not support AJAX!");
        return;
    } 

    var url="http://hellworld3.appspot./findcountry";
    var params = "screenname="+document.getElementById("screenname1").value+"&score="+document.getElementById("score1").value;
    alert("params: "+params);
    xmlHttp.open("POST",url,true);

    xmlHttp.onreadystatechange = function() 
    {
        alert("entered call back function. readstate value is: "+xmlHttpreadyState+". Response Text is: "+xmlHttp.responseText);

    if (xmlHttp.readyState==4)
    { 
        document.getElementById("message").innerHTML=xmlHttp.responseText;
    }
    }
    xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded")
    xmlHttp.send(params);

    //Testing code for synchronous mode
    //alert("Http get status is: "+xmlHttp.status);
    //alert("Http ready state value is: "+xmlHttp.readyState);
    //alert("Http get response text is: "+xmlHttp.responseText);
    //document.getElementById("message").innerHTML=xmlHttp.responseText;
    }


    function GetXmlHttpObject()
    {
        var xmlHttp=null;
        try
        {
            // Firefox, Opera 8.0+, Safari
            xmlHttp=new XMLHttpRequest();
        }
        catch (e)
        {
            // Internet Explorer
            try
            {
                xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
            }
            catch (e)
            {
                xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
        }
        return xmlHttp;
    }

    </script>


    </head>


    <body>

    <form name="testform">
        Screename: 
        <input type="text" id="screenname1" name="screenname">
        <br/>
        Score:
        <input type="text" id="score1" name="score" onchange="recordScore(this.value)"> 
        <br/>
        <p id="message">test</p>

        <input type="submit" value="Submit">
    </form>

    </body>


    </html>
Share Improve this question asked Dec 31, 2008 at 15:08 SatishSatish 851 gold badge2 silver badges7 bronze badges
Add a ment  | 

2 Answers 2

Reset to default 6

you have an error in the onreadystatechange function:

alert("entered call back function. readstate value is: "+xmlHttpreadyState+". Response Text is: "+xmlHttp.responseText);

xmlHttpreadyState should be xmlHttp.readyState

After I fixed that, it worked for me in FF3

Correct me if I'm wrong, but for POST don't you need to do a setRequestHeader for Content-Length like so;

xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlHttp.setRequestHeader('Content-length',(params?params.length:0));
xmlHttp.send(params);

This might correct your problem.

发布评论

评论列表(0)

  1. 暂无评论