George_Fal 2015-11-18 03:14 采纳率: 0%
浏览 29

send（）是一个匿名函数吗？

iam testing ajax on a wamp server but its saying that send() is an anonmyous function and iam getting blank document.

the console is logging: XHR finished loading: GET "http://localhost/json/main.json".(anonymous function) @ widget.js:21(which is xhr.send();)

my htmL:

    <!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>ajax</title>
        <link rel="stylesheet" href="css/style.css" media="screen" title="no title" charset="utf-8">
    </head>
    <body>
        <div id="employees">
        </div>
        <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
        <script type="text/javascript" src="js/widget.js"></script>
        <script type="text/javascript" src="json/main.JSON"></script>
    </body>
</html>

the json object: 

[
{
    "name": "Joe Consterdine",
    "workstatus": true
},

{
    "name": "Roberto Baggio",
    "workstatus": true
},

{
    "name": "Michael Smith",
    "workstatus": false
},

{
    "name": "Darren Huckerby",
    "workstatus": true
},

{
    "name": "Dean Blackwell",
    "workstatus": false
},

{
    "name": "Neil Sullivan",
    "workstatus": false
},

{
    "name": "Mark Fish",
    "workstatus": true
},

{
    "name": "Dean Holdsworth",
    "workstatus": true
}

]

my js code:

    var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
    if(xhr.onreadystate === 4){
        var employees = JSON.parse(xhr.responseText);
        var statusHTML = '<ul class="bulleted">';
        for(var i = 0; i<employees.length; i++ ){
            if(employees[i].workstatus === true){
                statusHTML += '<li class="in">';
            }else{
               statusHTML += '<li class="out">'; 
            }

            statusHTML += employees[i].name + '</li>';
        }
        statusHTML += '</ul>';
        document.getElementById('employees').innerHTML = statusHTML;
    }
}

xhr.open('GET', 'json/main.json');
xhr.send();
  • 写回答

1条回答 默认 最新

  • perhaps? 2015-11-18 03:20
    关注

    it's if(xhr.readyState ==4) not what you have

    you also should check the xhr.status in onreadystatechange

    So, your code would be

    var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
    if (xhr.readyState == 4 && xhr.status == 200) {
        var employees = JSON.parse(xhr.responseText);
        var statusHTML = '<ul class="bulleted">';
        for (var i = 0; i < employees.length; i++) {
            if (employees[i].workstatus === true) {
                statusHTML += '<li class="in">';
            } else {
                statusHTML += '<li class="out">';
            }

            statusHTML += employees[i].name + '</li>';
        }
        statusHTML += '</ul>';
        document.getElementById('employees').innerHTML = statusHTML;
    }
};

xhr.open('GET', 'json/main.json');
xhr.send();

    I prefer using onload/onerror

    var xhr = new XMLHttpRequest();
xhr.onload = function() {
    var employees = JSON.parse(xhr.responseText);
    var statusHTML = '<ul class="bulleted">';
    for (var i = 0; i < employees.length; i++) {
        if (employees[i].workstatus === true) {
            statusHTML += '<li class="in">';
        } else {
            statusHTML += '<li class="out">';
        }

        statusHTML += employees[i].name + '</li>';
    }
    statusHTML += '</ul>';
    document.getElementById('employees').innerHTML = statusHTML;
};
xhr.onerror = function(e) {
    console.log(e);
};
xhr.open('GET', 'json/main.json');
xhr.send();

    But onload/onerror may not be available in old broken browsers i.e. IE

    评论

报告相同问题？