JSON.parse（xmlhttp.responseText）返回空

Question

I am using Ajax. My search.php contains the javascript code. It requests for content.php which echoes an array $res that contains values in the form of "key" : value .

content.php :

echo json_encode($res);

search.php:

 <!--Load the AJAX API-->
<script type="text/javascript" src="https://www.google.com/jsapi"> </script>
 <script type="text/javascript">

var xmlhttp = new XMLHttpRequest();

xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {

alert(xmlhttp.responseText); //this alerts the correct content of $res but along with all the HTML page codes
var array = JSON.parse(xmlhttp.responseText); //also tried json_decode(xmlhttp.responseText, true); and jQuery.parseJSON( xmlhttp.responseText );
alert(array); // this doesn't alert at all
}
}
xmlhttp.open("GET", "<?php echo   @$this->config->base_url();  ?>index.php/content.php", true);

xmlhttp.send();

</script>

However, when I print $res alone in a separate page, it shows the correct output which is:

{"1894":1,"1905":0,"1916":0,"1927":0,"1938":0,"1949":0,"1960":0,"1971":0,"1982":0,"1993":0,"2004":1,"2015":2}

I tried to loop through the array:

var array = JSON.parse(xmlhttp.responseText);

for(var index in array) {

 alert(index+ " is: "+ array[index]);
}

But this also doesn't alert anything. I've been trying and searching on this for days but couldn't find a working solution.

Edit:

here is the output of alert(xmlhttp.responseText) :

part 1 of the alert window

part 2 of the alert window

couldn't post more than two links (because I don't have enough reputation), anyway you had a glimpse of it, I believe.

Answer 1

According to what I can see in both images, your PHP is giving you HTML code after the JSON object, that could be the problem that stops you from parsing it. Make sure you end PHP execution after echoing $res . In other words, try with this line:

echo json_encode($res);exit;

Also, in case that doesn't work, please change alert(xmlhttp.responseText) to console.log(xmlhttp.responseText) , check the browser console and copy here all the text you get back from the server

Answer 2

<script type="text/javascript">
    var url=<?php echo "'" . $this->config->base_url() . 'index.php/content.php';?>;
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {/* this was unclosed */
        if( xmlhttp.readyState == 4 && xmlhttp.status == 200 ) {
            var r=xmlhttp.responseText;
            console.info('ajax response: %s ',r);
            var array = JSON.parse(r);
        }
    }
    xmlhttp.open( "GET", url, true );
    xmlhttp.send();
</script>