Question

我正在使用JQuery开发PhoneGap应用程序，并使用AJAX从PHP文件发送和接收JSON数据。对于我的应用程序的一部分，我希望用户单击一个按钮，并显示一个空缺列表。返回的JSON如下所示：

{"Vacancy":{"vacancyID":"1","projectCode":"ABCD01","title":"a title","supervisor":"Some name","description":"A description of the project vacancy","course":"Computer Science"}},
{"Vacancy":{"vacancyID":"6","projectCode":"ABCD02","title":"some title","supervisor":"some supervisor","description":"description of sorts","course":"Computer Science"}}

我能够在警报中显示上述内容，但是当我尝试打印它时，它会输出：

action undefined -
undefined
undefined
undefined

以下是我用来尝试在我的html文件中打印出来的脚本：

<script>
    $(document).ready(function() {
        //load JSON data
        var output = $('#vacancies');
        $("#btnVacancy").click(function() {
            var data = {"action": "test" };

            $.ajax({
                //where php file is
                url: "http://localhost/helloworld/api.php",
                    //using GET in php file
                    type: "GET",
                    dataType: "json",
                    data: { type:"getV", pCourse:"Computer Science" },
                    ContentType: "application/json",
                    success: function(response) {
                        $.each(data, function(i, item) {
                            //data has been loaded
                            alert(JSON.stringify(response));
                            var vacancy = '<br>'
                            //project code
                            + '<h4>' + i + " " + item.projectCode + ' - ' + '</h4>'
                            // project title
                            + '<p>' + item.title + '<br>'
                            // project supervisor
                            + item.supervisor + '<br>'
                            //project description
                            + item.description + '</p>';

                        output.append(vacancy);
                    });
                },
                error: function(err) {
                    alert("Error: " + JSON.stringify(err));
                }
            })
        });
    });
</script>

我的问题是为什么警报中的信息是正确的，但一旦打印出来就是未定义的？

Answer 1

第一件事，$ .each（数据，函数（i，item）{此处数据不是数组或您的JSON数据，item.projectCode将始终未定义。

如果您的JSON是这样的，那么下面的代码应该适用于您的情况：

[{"Vacancy":{"vacancyID":"1","projectCode":"ABCD01","title":"a title","supervisor":"Some name","description":"A description of the project vacancy","course":"Computer Science"}},
{"Vacancy":{"vacancyID":"6","projectCode":"ABCD02","title":"some title","supervisor":"some supervisor","description":"description of sorts","course":"Computer Science"}}]

＆＃13;

var responseData = [{"Vacancy":{"vacancyID":"1","projectCode":"ABCD01","title":"a title","supervisor":"Some name","description":"A description of the project vacancy","course":"Computer Science"}},{"Vacancy":{"vacancyID":"6","projectCode":"ABCD02","title":"some title","supervisor":"some supervisor","description":"description of sorts","course":"Computer Science"}}]

$.each(responseData,function(i,item){
  alert(item.Vacancy.projectCode);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

Answer 2

您的解决方案的弱点：

$.each(data, function(i, item) {如果它不是数组，它将是未定义的。
  dataType: "json"中的
GET并不意味着您的.php使用相同的标头返回数据。在这种情况下，JSON.parse()将是必要的。

您正在警告alert(JSON.stringify(response));但是您正在追加output.append()迭代元素，从测试驱动开发的角度来看，这是一种不好的做法。测试您尝试使用的相同格式的数据。

JQuery打印未定义而不是来自JSON数组的数据

2 个答案: