如何使我的自定义按钮进行跳转日期功能?
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,basicWeek,basicDay, myCustomButton'
},
customButtons: {
myCustomButton: {
text: 'Jump to date!',
click: function() {
// Jump to date function
alert('clicked the custom button!');
}
}
},
是的,ADyson已经为您解答了这个,但只是为了澄清;该答案中给出的示例将带您到当前日期,如果这是您的意图,您将必须使用静态日期创建您的时刻对象,例如 -
date = moment("2018-01-04", "YYYY-MM-DD");
$("#calendar").fullCalendar( 'gotoDate', date );
或者,如果您需要使用日历的当前日期作为计算新日期的基础,比如说前进一周,例如您可以执行以下操作 -
currentDate = $('#calendar').fullCalendar('getDate');
newDate = moment(currentDate).add(7, 'days').format();
$("#calendar").fullCalendar( 'gotoDate', newDate );
https://momentjs.com/docs/#/manipulating/有关操纵moment.js对象的更多信息。
这将使日历在单击时转到特定日期:
customButtons: {
myCustomButton: {
text: 'Jump to date',
click: function() {
$("#calendar").fullCalendar('gotoDate', moment());
}
}
},
如图所示,这将简单地转到当前日期(实际上与内置的“今天”按钮“相同”。如果您希望它执行不同的操作,那么您可以做一些事情以允许用户选择除了进入(任意)日期之外,从问题中确切地说明你想要的是什么,所以很难提供更具体的建议。
有关fullCalendar gotoDate方法的详细信息,请参阅https://fullcalendar.io/docs/current_date/gotoDate/。
请参阅http://jsfiddle.net/sbxpv25p/82/以获取上述代码的工作演示。