【问题标题】:fullCalendar today button custom behaviorfullCalendar 今天按钮自定义行为
【发布时间】:2016-03-09 12:47:24
【问题描述】:

fullCalendar 有问题。我正在使用周视图(defaultView:'basicWeek')和工具栏按钮'今天','上一个','下一个'。当我点击“今天”按钮时,日历会导航回本周,但日期选择不会改变。我希望日历导航到当前周并在日历上选择今天的日期。但是我在重新定义“今天”按钮点击事件时遇到了麻烦。

代码示例:https://plnkr.co/edit/dv9yiq1CdJxfFTsDg4Yx?p=preview

defaultView: 'basicWeek',
            defaultDate: '2016-01-12',
            selectable: true,
            selectHelper: true,
            select: function(start, end) {
              console.log('select');
                var title = prompt('Event Title:');
                var eventData;
                if (title) {
                    eventData = {
                        title: title,
                        start: start,
                        end: end
                    };
                    $('#calendar').fullCalendar('renderEvent', eventData, true); 
                }
                $('#calendar').fullCalendar('unselect');
            }

在这种情况下,当我单击“今天”按钮时,我希望今天日期的弹出窗口(警报)出现。所以基本上,单击按钮不仅可以将我导航到当前周,还可以选择当前日期。

【问题讨论】:

  • 你能提供一些代码吗?

标签: javascript angularjs fullcalendar ui-calendar


【解决方案1】:

您可以手动监听今天的按钮点击,然后调用日历的 select 方法传递正确的参数。

试试下面的代码: https://plnkr.co/edit/62Dx5pVrDDXnwoME5jbU?p=preview

calendar.find('.fc-today-button').click(function(){
  var start = new Date();
  start.setHours(0,0,0,0);
  var end = new Date();
  end.setDate(end.getDate() + 1);
  end.setHours(0,0,0,0);
  calendar.fullCalendar('select', start, end);
});

【讨论】:

  • 我有一个角度应用程序,我试过了。 ngOnInit() { $('#calendar').find('.fc-today-button').click(function() { alert("test"); }); } 但它没有触发任何事件
  • 尽管 ngOnInit() 尝试使用另一个角度钩子(可能是 ngAfterViewChecked() )。调用 ngOnInit() 时,可能尚未呈现 html。由于那个 jquery 在页面上找不到 ("#calendar")。
  • 谢谢它的工作。但是,我不知道为什么它会永远发出警报。我不知道为什么
  • 嘿,我仍然无法解决这个问题。当我这样做时,事件会触发超过 400 次。我试图 $.unbind 但是在这种情况下日历不会切换大小写。你知道为什么它会多次触发事件吗?
猜你喜欢
  • 1970-01-01
  • 2018-05-04
  • 2012-03-22
  • 1970-01-01
  • 2019-07-24
  • 2012-02-13
  • 1970-01-01
  • 2020-03-17
  • 1970-01-01
相关资源
最近更新 更多