Javascript Google Calendar jquery在错误的日期列出了所有当天的事件
我在寻找一种可以让我从公共谷歌日历中提取事件并将其显示为事件列表的东西。我遇到了一个jquery脚本,它满足了这一需求,并允许定制其外观(css),但有一个问题。对于谷歌日历上的“全天”事件,它们将提前一天显示,即。。4号的一个事件显示为3号 我对jquery几乎没有经验,因此非常感谢您对脚本中可能需要更改或修改的内容提供任何指导Javascript Google Calendar jquery在错误的日期列出了所有当天的事件,javascript,jquery,google-calendar-api,Javascript,Jquery,Google Calendar Api,我在寻找一种可以让我从公共谷歌日历中提取事件并将其显示为事件列表的东西。我遇到了一个jquery脚本,它满足了这一需求,并允许定制其外观(css),但有一个问题。对于谷歌日历上的“全天”事件,它们将提前一天显示,即。。4号的一个事件显示为3号 我对jquery几乎没有经验,因此非常感谢您对脚本中可能需要更改或修改的内容提供任何指导 (function(t, e, n, a) { "use strict"; var i = "google_calendar_events";
(function(t, e, n, a) {
"use strict";
var i = "google_calendar_events";
var s = {
key: null,
calendar: null,
max: 7
};
function r(e, n) {
this.element = e;
this.settings = t.extend({}, s, n);
this.init();
}
r.prototype.init = function() {
var t = this;
if (!t.settings.key || !t.settings.calendar) {
return false;
}
t.getCalendarEvents();
};
r.prototype.getCalendarEvents = function() {
var e = this;
e.settings.apiUrl = "https://www.googleapis.com/calendar/v3/calendars/" + e.settings.calendar + "/events";
t.get(e.settings.apiUrl, {
maxResults: e.settings.max,
singleEvents: true,
orderBy: "startTime",
timeMin: new Date().toISOString(),
key: e.settings.key
}, function(t) {
if (t.hasOwnProperty("items")) {
e.build(t.items);
}
});
};
r.prototype.build = function(e) {
var n = this;
t(n.element).html('<ul class="eventlist"></ul>');
for (var a = 0; a < e.length; a++) {
var i = e[a];
var s = !i.start.hasOwnProperty("dateTime");
var r = s ? new Date(i.start.date) : new Date(i.start.dateTime);
var o = "<li>";
if (i.summary && i.htmlLink) {
o += '<div class="g_day_div">' + n.formatDate(r, s) + '</div>';
}
o += '<div class="event_title">' + '<a href="' + i.htmlLink + '" rel="' + i.summary + '">' + i.summary + '</a>' + '</div>';
if (i.location) {
o += '<div class="location">' + i.location + '</div>';
}
if (i.description) {
o += '<div class="description">' + i.description + '</div>';
}
o += "</li>";
t(n.element).find("ul.eventlist").append(o);
}
};
r.prototype.formatDate = function(t, e) {
t = t instanceof Date ? t : new Date(t);
var n = [ "Sun", "Mon", "Tues", "Weds", "Thu", "Fri", "Sat" ];
var a = [ "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ];
var i = t.getHours();
var s = t.getMinutes();
var r = i > 11 ? "pm" : "am";
i = i > 12 ? i - 12 : i;
s = s < 10 ? "0" + s : s;
var o = i + ":" + s + r;
var l = '<div class="g_month">' + a[t.getMonth()] + '</div>' + '<div class="g_day">' + t.getDate() + '</div>';
return e ? l : l;
};
t.fn[i] = function(e) {
return this.each(function() {
if (!t.data(this, "plugin_" + i)) {
t.data(this, "plugin_" + i, new r(this, e));
}
});
};
})(jQuery, window, document);
(函数(t,e,n,a){
“严格使用”;
var i=“谷歌日历事件”;
变量s={
key:null,
日历:空,
最高:7
};
函数r(e,n){
该元素=e;
this.settings=t.extend({},s,n);
this.init();
}
r、 prototype.init=函数(){
var t=这个;
如果(!t.settings.key | |!t.settings.calendar){
返回false;
}
t、 getCalendarEvents();
};
r、 prototype.getCalendarEvents=函数(){
var e=此;
e、 settings.apiUrl=”https://www.googleapis.com/calendar/v3/calendars/“+e.settings.calendar+”/events”;
t、 获取(e.settings.apirl{
maxResults:e.settings.max,
单身事件:对,
订购人:“开始时间”,
timeMin:new Date().toISOString(),
键:e.settings.key
},功能(t){
如果(t.hasOwnProperty(“项目”)){
e、 构建(t.items);
}
});
};
r、 prototype.build=函数(e){
var n=这个;
html('
);
对于(var a=0;a”;
if(i.summary&&i.htmlink){
o+=''+n.formatDate(r,s)+'';
}
o+=''+''+'';
如果(i.地点){
o+=''+i.位置+'';
}
如果(i.说明){
o+=''+i.说明+'';
}
o+=“”;
t(n.element).find(“ul.eventlist”).append(o);
}
};
r、 prototype.formatDate=函数(t,e){
t=t日期实例?t:新日期(t);
变量n=[“太阳”、“周一”、“周二”、“周三”、“周四”、“周五”、“周六”];
变量a=[“一月”、“二月”、“三月”、“四月”、“五月”、“六月”、“七月”、“八月”、“九月”、“十月”、“十一月”、“十二月”];
var i=t.getHours();
var s=t.getMinutes();
var r=i>11?“下午”:“上午”;
i=i>12?i-12:i;
s=s<10?“0”+s:s;
VarO=i+“:”+s+r;
变量l=''+a[t.getMonth()]+''+t.getDate()+'';
返回e?l:l;
};
t、 fn[i]=函数(e){
返回此值。每个(函数(){
如果(!t.data(这个“插件”+i)){
t、 数据(这个“插件”+i,新的r(这个,e));
}
});
};
})(jQuery、窗口、文档);
您遇到的问题是因为时区。当您调用newdate(…)
时,将创建一个日期对象,但请注意,该对象还包含时间信息(在本例中,时间信息是根据计算机的时区猜测的)
例如,将我的计算机日期设置为洛杉矶时区,调用新日期('2019-01-15')
将生成以下日期:2019年1月14日星期一16:00:00 GMT-0800(太平洋标准时间)
日期构造函数将日期字符串理解为UTC时间,但调用getDate、getHours等函数将返回基于本地时区的信息
作为一种解决方法,您可以使用函数getUTCDate、getUTCHours等。请参阅下面提供的代码的改编(唯一修改的函数是r.prototype.formatDate):
(函数(t,e,n,a){
“严格使用”;
var i=“谷歌日历事件”;
变量s={
key:null,
日历:空,
最高:7
};
函数r(e,n){
该元素=e;
this.settings=t.extend({},s,n);
this.init();
}
r、 prototype.init=函数(){
var t=这个;
如果(!t.settings.key | |!t.settings.calendar){
返回false;
}
t、 getCalendarEvents();
};
r、 prototype.getCalendarEvents=函数(){
var e=此;
e、 settings.apiUrl=”https://www.googleapis.com/calendar/v3/calendars/“+e.settings.calendar+”/events”;
t、 获取(e.settings.apirl{
maxResults:e.settings.max,
单身事件:对,
订购人:“开始时间”,
timeMin:new Date().toISOString(),
键:e.settings.key
},功能(t){
如果(t.hasOwnProperty(“项目”)){
e、 构建(t.items);
}
});
};
r、 prototype.build=函数(e){
var n=这个;
html('
);
对于(var a=0;a”;
if(i.summary&&i.htmlink){
o+=''+n.formatDate(r,s)+'';
}
o+=''+''+'';
如果(i.地点){
o+=''+i.位置+'';
}
如果(i.说明){
o+=''+i.说明+'';
}
o+=“”;
t(n.element).find(“ul.eventlist”).append(o);
}
};
r、 prototype.formatDate=函数(t,e){
t=t日期实例?t:新日期(t);
变量n=[“太阳”、“周一”、“周二”、“周三”、“T