Question

我的最终目标是制作一个允许用户为他们的课程表安排参数的应用程序（即“我需要A级，B级和C级，我想要D级，G级， E，我只想上4节课，我不想在上午10点之前上课，然后我想向用户展示他们所有可能的日程安排（使用完整日历http://arshaw.com/fullcalendar/中的事件）

我不太了解使用API或JSON（也是JavaScript的新手）所以我对如何做到这一点的可能性感到有些不知所措。

我进行了广泛的搜索，发现$ .getJSON提到了很多，所以我有这样的事情：

$.getJSON(
    "http://vazzak2.ci.northwestern.edu/courses/?term=4540&subject=ACCT",
    function(result) 
    {

    }
);

我认为将JSON作为字符串返回，是吗？有没有一种好方法可以将其拆分为对象或数组？

为简洁起见，此处显示了部分JSON：

[
  {
    "id": 52239,
    "title": "Accounting for Decision Making",
    "term": "2014 Spring",
    "school": "KGSM",
    "instructor": {
      "name": "Ronald A Dye",
      "bio": null,
      "address": null,
      "phone": null,
      "office_hours": null
    },
    "subject": "ACCT",
    "catalog_num": "430-0",
    "section": "71",
    "room": "Wieboldt Hall 207",
    "meeting_days": "Tu",
    "start_time": "18:00:00",
    "end_time": "21:00:00",
    "start_date": "2014-03-31",
    "end_date": "2014-06-07",
    "seats": 65,
    "overview": null,
    "topic": null,
    "attributes": null,
    "requirements": null,
    "component": "LEC",
    "class_num": 37561,
    "course_id": 3,
    "coursedesc_set": [],
    "coursecomponent_set": []
 },
...
...

我试过了：

obj = JSON.parse(result);

并且网络上的建议说要遵循以下内容：

alert(obj.id);

然而，这不起作用，因为似乎从API中提取的JSON嵌套在一种方式中（即它是该主题中提供的所有课程，并且每个都是JSON）。所以它不知道返回哪个“id”值。如果你看一下JSON的链接，你可能会更清楚我的意思。如果有人对从哪里开始有任何指导，我将不胜感激。我刚刚读过关于json的文章，但仍然没有找到任何地方。

如果我能弄明白如何将json解析为每个对象，那么我可以称之为“所有类的'时间'＆gt;上午10点。

Answer 1

返回的对象是array。您需要迭代数组中的每个元素。

更新了工作演示：

$.getJSON("http://vazzak2.ci.northwestern.edu/courses/?term=4540&subject=ACCT", function(result) {
    var earlyCourses = [];

    $(result).each(function (index, item) {
        $('#search_results').text((index+1) + " total courses");

        if (item.start_time > '10:00:00') {
            console.log(item);
            $('#morning_results_list').append('<li>' + item.title + '</li>');
        }        
    });
});

使用以下样板容器：

<h2 id="search_results"></h2>

<div id="morning_results_container">
    <h5>Morning Courses</h5>
    <ul id="morning_results_list">
    </ul>    
</div>

关于此示例的一些注意事项：

这里的时间检查非常幼稚，并且正在恢复为字母比较，而不是实际的日期/时间检查。
以这种方式插入多个li对于UI性能不利，对DOM的所有更新都应该批量处理为单个更新。只要结果数量很少（少于几百），每次迭代插入的示例就会起作用。

JSFIDDLE示例：http://jsfiddle.net/h2a3t/

将JSON从API转换为“课程”对象的集合

1 个答案: