引入JSON数据

我正在尝试从json数据中获取事件日历。 我只是想突出显示日期，并在日历下方更新div，并在用户点击日期时显示活动详细信息。 我的应用程序以下列forms提供JSON：

[ {"Date":"02/06/2012","Title":"Eat, Bike, and Swim"}, {"Date":"02/03/2012","Title":"Sleep"}, {"Date":"02/02/2012","Title":"Laugh"} ] 

我有一个JS小提琴，它使用变量定义，但我无法让它响应JSON请求。

这是我最好的尝试： http ： //jsfiddle.net/PGmFv/2/

javascript是：

 $（document）.ready（function（）{
   var dp，events;
   events = [];
   return dp = $（“。blog_calendar”）。datepicker（{
     beforeShowDay：function（date）{
       var匹配，结果;
       $ .getJSON（“https://raw.github.com/gist/1676157/15ce81851e57dfcecb985039e970a749585959de/my.json”，function（data）{
         return events = data;
       }）;
       result = [true，“”，null];
       matching = $ .grep（events，function（event）{
         return event.Date.valueOf（）=== date.valueOf（）;
       }）;
       if（matching.length）{
         result = [true，“highlight”，null];
       }
      返回结果;
     }，
     onSelect：function（dateText）{
       var date，event，i，selectedDate;
       date = void 0;
       selectedDate = new Date（dateText）;
       i = 0;
       event = null;
       while（i <events.length &&！event）{
         date = events [i] .Date;
         if（selectedDate.valueOf（）=== date.valueOf（））{
           event = events [i];
         }
        我++;
       }
       if（event）{
         return alert（event.Title）;
       }
     }
   }）;
 }）;

我正在尝试加载datepicker函数中的json，因为我希望能够在同一页面上有多个日历， this.id包含一个特定的url变量，所以我可以调用$.getJSON('/events/' + this.id + '/data.json',function() {}

任何想法都非常感激。 我非常倾向于： 使用json数据源和带有事件的Datepicker的 jQuery UI Datepicker中的 事件？ 但只是无法让json在正确的时间以正确的方式加载。

控制台中没有错误没有帮助。

Answer 1

为了从另一个域获取JSON数据，您必须使用带有回调函数的JSONP。 Github API支持这个（ 示例 ），jQuery处理自动使用dataType: 'jsonp'进行回调。

这就是我用jQuery从Github gist获取JSON数据的方法：

 $.ajax({ url: 'https://api.github.com/gists/'+gistid, type: 'GET', dataType: 'jsonp' }).success( function(gistdata) { // This can be less complicated if you know the gist file name var objects = []; for (file in gistdata.data.files) { if (gistdata.data.files.hasOwnProperty(file)) { var o = JSON.parse(gistdata.data.files[file].content); if (o) { objects.push(o); } } } if (objects.length > 0) { // DoSomethingWith(objects[0]) } }).error( function(e) { // ajax error }); 

（ jsFiddle ）

Answer 2

相当多的代码需要深入研究，但是你不是在进行异步调用然后尝试从匿名函数返回一个值吗？ 尝试在启动 getJSON之后使用events ，但可能在实际获取数据之前使用了很多events ？

Answer 3

此错误即将发生，因为请求

  $.getJSON("https://raw.github.com/gist/1676157/15ce81851e57dfcecb985039e970a749585959de/my.json") 

不在同一个域中。所以console.log（）显示此错误

  Origin http://fiddle.jshell.net is not allowed by Access-Control-Allow-Origin. 

运行$ .getJSON（’相同域请求’）将不会导致错误。

查看小提琴并查看控制台错误消息。 http://jsfiddle.net/PGmFv/10/