Question

我想在agendaWeek视图中确定单击日标题单元格时选择的日期。我可以为这些标题单元格添加一个单击处理程序，但我不太清楚如何从fullcalendar获取日期，因为单击标题时dayClick事件不会触发。这些单元格上的类是fc-sun，fc-mon等。

Answer 1

尝试我自己创造的这种解决方法。它将通过点击日标题轻松地从agendaWeek导航到agendaDay，只需在fullcalendar init之后调用zumaMaker（）。

function zumaMaker() {

 var arrayUIDays = ['mon', 'tue', 'wed', 'thu', 'fri', 'sat', 'sun'];
 for (var m = 0; m < arrayUIDays.length; m++) {
    var dim = ".fc-day-header.fc-widget-header.fc-" + arrayUIDays[m];
    var dok = $(dim).html();
    $(dim).attr("onclick", "zumaMethod( '" + dok + "','" + dim + "');");
    $(dim).css("cursor", "pointer");
    }
}

function zumaMethod(doma, diver) {

  var date = doma.split(" ")[1].split("/");
  var day = date[0];
  var month = date[1];
  var year = date[2];
  var off_date = year + "-" + month + "-" + day + "T" + "00:00:00";

  $("#pl_tbl").fullCalendar('changeView', 'agendaDay');
  $("#pl_tbl").fullCalendar('gotoDate', off_date);
  $(diver).css("cursor", "pointer");
  $(diver).attr("onclick", "zumaMethodRevert();");
}

function zumaMethodRevert() {
  $("#pl_tbl").fullCalendar('changeView', 'agendaWeek');
  zumaMaker();
}

此外，您可以添加此css以自定义悬停时的日期标题。

.fc-day-header:hover {
   background-color: orange;
}
.fc-day-header {
   background-color: white;
}

Answer 2

由于没有人回答，他就是我所做的。议程viewObject具有显示当前周的开始日期和结束日期。我创建了一个包含所显示周的所有日期的数组。然后，我使用JQuery选择所有th标题单元格，并为每个标记添加日期属性。我还为每个标记添加了一个click事件，并在单击标题时检索了date属性。必须在显示每个新周时执行此过程。

FullCalendar - 通过在agendaWeek视图中单击日标题获取日期

2 个答案: