0

我正在使用 fullcalendar，想知道是否有办法让某些日期无法点击。到目前为止，我拥有的功能将日历上的所有“日方”日期与我之前定义的最大日期进行比较。如果日期超过最大日期，我会添加一个类以将它们变灰。它们仍然是可点击的。用日历的布局隐藏它们，看起来很糟糕。

            // Grey out the dates that go beyond the maximum availability date 
            var maxParsed = Date.parse(maxDate.toString());
            $("td[data-date]").each(function(){
                var date = $(this).data('date');
                var dateParsed = Date.parse(date);
                if(!isNaN(dateParsed) && dateParsed > maxParsed){
                    $(this).addClass('fc-other-month');
                }
            });
4

2 回答 2

2

我认为只有使用 css 才能处理这个问题。在您的 CSS 上执行以下操作：

.fc-other-month {
  pointer-events: none;
  cursor: default;
}

CSS 属性 pointer-events 允许作者控制在什么情况下（如果有）特定图形元素可以成为鼠标事件的目标。如果未指定此属性，则 visiblePainted 值的相同特征适用于 SVG 内容。

您可以在这里了解更多信息：https ://developer.mozilla.org/en/docs/Web/CSS/pointer-events

如果它不起作用，也许阻止默认值可以解决问题。

$('.fc-other-month').on('click', function(e) {
   e.preventDefault();
   $(this).css({'pointer-events' : 'none'});
});

=== 编辑 ====

我查看了文档，他们有eventClick. 您可以在该函数内部检查它是否是“好日期”，如果您不想被点击，则返回 false。

$('#calendar').fullCalendar({
    eventClick: function(calEvent, jsEvent, view) {

        if ( 1==1 || "this is a day without click feature") { //dummy code
           return false; //prevent clickable function
        }

    }
});

https://fullcalendar.io/docs/mouse/eventClick/

于 2016-11-18T19:23:48.180 回答
0

return false在click您不希望被点击的日期借助 jQuery 和事件（我猜您为它分配了不同的类）。所以他们不会对点击采取行动......

于 2016-11-18T19:22:35.497 回答