防止在 jQuery FullCalendar 中呈现其他月份事件

发布于 2024-10-11 21:52:24 字数 333 浏览 8 评论 0原文

我想禁止 fullcalendar 显示其他月份单元格中的事件。我想我可以通过 eventRender 事件来做到这一点。

$('#calendar').fullCalendar({
    events: $.fullCalendar.myFeed(),
    eventRender: function (event, element) {
        if (event.start.getMonth() != ????)
            $(element).hide();
   }
});

我不知道该用什么来代替？？？？获取日历的当前月份。有人有一些建议吗？

原文

I'd like to prohibit fullcalendar from displaying events in the other month cells. I figured I could do this with the eventRender event.

$('#calendar').fullCalendar({
    events: $.fullCalendar.myFeed(),
    eventRender: function (event, element) {
        if (event.start.getMonth() != ????)
            $(element).hide();
   }
});

I can't figure out what to replace the ???? to get the calendar's current month. Anybody have some tips?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

静若繁花 2024-10-18 21:52:24

我想没有办法从此事件中引用父日历。 “this”指的是事件对象。我没有意识到视图也作为第三个参数传递。我能够使用以下代码来完成此操作：

    $('#calendar').fullCalendar({
        events: $.fullCalendar.myFeed(),
        eventRender: function (event, element, view) {
            if (event.start.getMonth() != view.start.getMonth())
                return false;
        }
    });

I guess there isn't a way to reference the parent calendar from within this event. "this" refers to the event object. I didn't realize that the view also gets passed as a third parameter. I was able to accomplish this using the following code:

    $('#calendar').fullCalendar({
        events: $.fullCalendar.myFeed(),
        eventRender: function (event, element, view) {
            if (event.start.getMonth() != view.start.getMonth())
                return false;
        }
    });

回复收藏 0 原文

走过海棠暮 2024-10-18 21:52:24

如果您使用带年视图的全日历 (https://github.com/tpruvot/fullcalendar)。
您不能在年视图上使用 view.start.getMonth() 。
我使用了一个小技巧来传递 eventAfterRender ：

eventAfterRender: function (event, element, view) {
    var col=element.closest('td').index()+1;
    var $cellh=element.closest('table').find('thead td:nth-child('+col+')');
    if ($cellh.hasClass('fc-other-month') == true)
            element.css('visibility','hidden')
},

If you use a fullcalendar with year view (https://github.com/tpruvot/fullcalendar).
You cannot use view.start.getMonth() on year view.
I used a little trick passing through eventAfterRender :

eventAfterRender: function (event, element, view) {
    var col=element.closest('td').index()+1;
    var $cellh=element.closest('table').find('thead td:nth-child('+col+')');
    if ($cellh.hasClass('fc-other-month') == true)
            element.css('visibility','hidden')
},

回复收藏 0 原文

如梦亦如幻 2024-10-18 21:52:24

您可以使用一些自定义样式来完成

.fc-other-month {
    background: white !important;
}

.fc-row .fc-bg {
    z-index: 5;
    pointer-events: none;
}

这里的解决方案：使用fc-other-month的日期覆盖current-month的日期，背景为白色。

You can do it with some custom style

.fc-other-month {
    background: white !important;
}

.fc-row .fc-bg {
    z-index: 5;
    pointer-events: none;
}

The solution here: using day of fc-other-month over the day of curent-month with background white.

回复收藏 0 原文

枯叶蝶 2024-10-18 21:52:24

eventRender: function(event, element) {

  var view = $('#calendar').fullCalendar('getView');
  if (event.start.month() == view.intervalStart.month()) {
    element.addClass("bg-blue");
  }
},

eventRender: function(event, element) {

  var view = $('#calendar').fullCalendar('getView');
  if (event.start.month() == view.intervalStart.month()) {
    element.addClass("bg-blue");
  }
},

回复收藏 0 原文

~没有更多了~