全日历跳转至日期

Gen*_*Gen 5 javascript fullcalendar

如何使我的自定义按钮具有跳转到日期的功能?

$('#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!');
            }
        }
    },
Run Code Online (Sandbox Code Playgroud)

小智 7

是的,ADyson 已经为您回答了这个问题,但只是为了澄清一下;该答案中给出的示例将带您到达当前日期,如果这是您的意图,您必须使用静态日期创建时刻对象,例如 -

date = moment("2018-01-04", "YYYY-MM-DD");
$("#calendar").fullCalendar( 'gotoDate', date );
Run Code Online (Sandbox Code Playgroud)

或者,如果您需要使用日历的当前日期作为计算新日期的基础,例如向前一周,您可以执行以下操作 -

currentDate = $('#calendar').fullCalendar('getDate');
newDate = moment(currentDate).add(7, 'days').format();
$("#calendar").fullCalendar( 'gotoDate', newDate );
Run Code Online (Sandbox Code Playgroud)

https://momentjs.com/docs/#/manipulated/了解有关操作 moment.js 对象的更多信息。


ADy*_*son 6

这将使日历在单击时转到特定日期:

customButtons: {
  myCustomButton: {
    text: 'Jump to date',
    click: function() {
      $("#calendar").fullCalendar('gotoDate', moment());
    }
  }
},
Run Code Online (Sandbox Code Playgroud)

如图所示,这将简单地转到当前日期(实际上与内置的“今天”按钮“的作用相同)。如果您希望它做一些不同的事情,那么您可以做一些事情来允许用户选择一个从这个问题中并不清楚你到底想要什么,除了去一个(任意的)约会之外,所以很难提供任何更具体的建议。

有关 fullCalendar gotoDate 方法的详细信息,请参阅https://fullcalendar.io/docs/current_date/gotoDate/ 。

有关上述代码的工作演示,请参阅http://jsfiddle.net/sbxpv25p/82/ 。