我正在尝试从 json 数据获取事件日历。我只想突出显示日期,并在用户单击日期时在日历下方更新一个包含事件详细信息的 div。我的应用程序以以下形式提供 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 matching, result;
$.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];
}
return result;
},
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];
}
i++;
}
if (event) {
return alert(event.Title);
}
}
});
});
我正在尝试在 datepicker 函数内加载 json,因为我希望能够在同一页面上有多个日历并且this.id
包含一个特定的 url 变量,以便我可以调用$.getJSON('/events/' + this.id + '/data.json',function() {}
任何想法都非常感激。我非常倾向于:具有 json 数据源的 jQuery UI Datepicker 中的事件 and 带事件的日期选择器?但就是无法在正确的时间以正确的方式加载 json。
控制台中没有错误并没有帮助。