Question

在议程视图中，我的屏幕上显示7天，并且我有一个按钮可以浏览月份（即转到第二天）。我有一个函数，可以让我单击我单击的时隙的开始和结束。它在7天工作正常，但仅在加载的页面上有效，但是如果我单击以转到第二天，然后单击一个时间段，它将不再起作用。我检查html结构是否仍然相同，但我的功能无法正常工作。

这是我的代码：

$("div.fc-slats table tbody tr").click(function () {
                var borne_sup = $(this).attr("data-time");
                var borne_inf = $(this).next().attr("data-time");
                console.log(borne_sup);
                console.log(borne_inf);
            });

你能帮我吗？

Answer 1

如果仅在首次渲染日历时添加click事件，它将在该点附加到每一行。当您单击下一步时，新元素将被添加到DOM中，因此，如果您不再次运行代码，则这些元素将不会附加click事件。

修复该问题应该可以解决，但是另一种方法是使用FullCalendar回调eventClick，这使您可以访问单击的事件，而不必手动附加单击处理程序。

eventClick(event, jsEvent, view) {
  console.log(event.start, event.end);
}

Example Codepen

Answer 2

我是Web开发的新手，所以我不确定该怎么做，但是我找到了另一种方法：

$("body").on("click", "div.fc-slats table tbody tr", function () {
                borne_sup = $(this).attr("data-time");
                borne_inf = $(this).next().attr("data-time");
                console.log(borne_sup);
                console.log(borne_inf);

            });

谢谢您的帮助。

满负荷日历功能

2 个答案: