JS FullCalendar V4右键单击菜单-选定日期
JS FullCalendar V4右键单击菜单-选定日期
提问于 2019-11-21 17:56:56
(V4)我试图在我的日历中添加一个右键菜单，这将允许用户对事件执行其他操作。
我需要弄清楚如何获得在我的alert()中显示的选定日期值，以便为这些日期分配变量并创建事件。
首先，我禁用了默认菜单，如下所示：
$("#calendar").on("contextmenu",function (event) {event.preventDefault();});接下来，我为右击创建了一个事件：
jQuery(document.body).on("mousedown", function(event){
if(event.button==2){
alert();
}
});日历中的selectable值设置为true。
如何在alert()中获得选定的日期值
编辑我尝试过alert(calendar.selectionInfo)，但它是undefined
编辑2我的日历html
<link href='vendor/fullcalendar/core/main.css' rel='stylesheet' />
<link href='vendor/fullcalendar/daygrid/main.css' rel='stylesheet' />
<link href='vendor/fullcalendar/timegrid/main.css' rel='stylesheet' />
<div id="calendar"></div>
<script src="./vendor/jquery/jquery.min.js"></script>
<script src="./vendor/fullcalendar/core/main.min.js"></script>
<script src="./vendor/fullcalendar/daygrid/main.min.js"></script>
<script src="./vendor/fullcalendar/timegrid/main.min.js"></script>
<script src="./vendor/fullcalendar/interaction/main.min.js"></script>编辑3对我的代码做了一些修改
$("#calendar").on("mousedown", function(event){
if(event.button==2){
alert(calendar.selectionInfo);
}
});回答 1
Stack Overflow用户
发布于 2019-11-21 19:53:23
你想要的似乎不容易..。
FullCalendar API提供了一些相近的内容：https://fullcalendar.io/docs/dateClick
使用此选项，您可以在创建日历时传递给您，您可以决定用户单击日期时会发生什么，但我假设它仅限于左键单击。
例如，在警报中显示日期：
let calendar = new Calendar(calendarEl, {
plugins: [ interactionPlugin ],
dateClick: function(info) {
alert('Clicked on: ' + info.dateStr);
}
});如果你真的想要右击，我正在尝试另一个解决方案，但它不会是干净的代码.更新很快
编辑
我发现一些有用的东西，但它不干净，你很快就会被限制.
document.querySelectorAll(".fc-day").forEach(
element => element.addEventListener(
"contextmenu",
event => {
event.preventDefault();
event.stopPropagation();
alert(event.target.dataset.date); //here you have the date of the cell
}
)
);页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/58981015
复制相关文章
相似问题
腾讯云开发者
