我正在尝试实现一个AJAX调用。 我究竟做错了什么？

Question

This is my HTML text:

<input type="text" class="resizedsearch" name="searchdb">
<button id="submit" onclick="ajaxCall()">Search!</button>

This is Javascript:

ajaxCall()
{
    var xmlhttp = new XMLHttpRequest();

    var url = "http://localhost:8080/CSE%205335%20Project%20One/userInfo.php";

    xmlhttp.onreadystatechange=function()

    {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
        {
            myFunction(xmlhttp.responseText);
        }
    }

    xmlhttp.open("GET", url, true);
    xmlhttp.send('searchdb');

    function myFunction(response)
    {
        var obj = JSON.parse(response);

        document.getElementById("democity").innerHTML =
        obj.city;

        document.getElementById("demodes").innerHTML =
        obj.description;

        document.getElementById("latlon").innerHTML =
        obj.latitude + "," + obj.longitude;

    }
}

And this is where I am trying to display the response that I am receiving from the PHP file:

<b><font size="24" face="Cambria"><p id="democity"></p></font></b>
<font size="6" face="Cambria"><p id="demodes"></p></font>
</br>

The output of the PHP file is stored in $outp and it is in the JSON format.

Any help appreciated. Thank you.

!!UPDATE!!

function ajaxCall()
{
var xmlhttp = new XMLHttpRequest();
var url = "http://localhost:8080/CSE%205335%20Project%20One/userInfo.php";

xmlhttp.onreadystatechange=function() 
{

xmlhttp.open("GET", url, true);
xmlhttp.send('searchdb');

    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) 
    {
    myFunction(xmlhttp.responseText);
    }
}
}

function myFunction(response)
{
var obj = JSON.parse(response);

document.getElementById("democity").innerHTML =
obj.city;

document.getElementById("demodes").innerHTML =
obj.description;

document.getElementById("latlon").innerHTML =
obj.latitude + "," + obj.longitude;

}

This is how the improvised code looks. Still not working.

Answer 1

Example by FactoryAidan is not going to work as it violates Same Origin Policy (unless you'll run the code in browser console on Google page). Try replacing http://www.google.com with your local address. I tested the code with a little modification and it works, or at least gives alert, so the function is called. Here's it is:

function ajaxCall(){
    var xmlhttp = new XMLHttpRequest();
    var url = "http://localhost:8080"; /* but make sure the url is accessible and of same origin */

    xmlhttp.onload=function(){
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            myFunction(xmlhttp.responseText);
        }
    }

    xmlhttp.open("GET", url, true);
    xmlhttp.send('searchdb');
}


function myFunction(response){
    alert('I made it here');
}