javascript - 全日历:检测周或日 View 中的点击

Question

我目前正在月 View 中检测双击事件。这效果很好:

dayRender: (date, element) => {
  element.bind('dblclick', ...)
}

我正在寻找一种当用户处于日 View 或周 View 时执行相同操作的方法。我希望能够检测点击事件，并获取他们点击的日期和时间(请注意，时间与日/周 View 相关，但与月 View 无关)。

有什么想法吗？

Answer 1

对于将来发现此问题的任何人，这是我想出的解决方案:

因为 fullcalendar 不会渲染 <div>每个时间段(例如，一个 div 代表 2015 年 1 月 2 日下午 1 点到下午 1:30)，并且在视觉上将单个时间段表示为行和列的交集，我们需要一种方法来计算时间从给定的点击。日期信息已以 data-date 的形式附加到每列(日期)DOM 元素。属性。我所做的是我forked fullcalendar，并使用 new data-time attribute 添加时间信息到每行(时间段) .

然后，我监听了 onViewRender 上的双击事件，找出用户单击的元素，并从中导出日期和时间段:

viewRender: (view, element) ->

  if view.type in ['agendaDay', 'agendaWeek']
    element.on 'dblclick', (event) ->

      els = document
        .elementsFromPoint event.pageX, event.pageY
        .filter (e) -> (e.hasAttribute 'data-date') or (e.hasAttribute 'data-time')
      date = (_.find els, (e) -> e.hasAttribute 'data-date').getAttribute 'data-date'
      time = (_.find els, (e) -> e.hasAttribute 'data-time').getAttribute 'data-time'

      return unless date and time

      startTime = moment "#{ date } #{ time }"
      endTime = (moment startTime).add 30, 'minutes' # clone + increment

这是一个非常hacky的解决方案，并且混合了各种问题。但是，直到 fullcalendar 添加对 timeClick 的支持事件，这效果很好。

希望这对其他人有帮助!