fullcalendar 版本 6.15 - 如何在事件点击时获取事件 ID 以及如何在事件描述中添加换行符?

问题描述 投票:0回答:1

搜索了SO,例如this threadthis one,但尚未找到可行的解决方案。基本上,一旦添加了事件,ID 就不在 HTML 中了。但我们需要 ID 来进行后台工作。

第二个问题是,如何在事件描述中添加换行符?我尝试使用

<br>
\n
,但都不起作用。

感谢您的宝贵时间。

HTML:

        <div id='calendar'></div>

JS代码如下

<script>
    document.addEventListener('DOMContentLoaded', function () {
        createCalendar();
    });
</script>
<script>
    function createCalendar() {
        var calendarEl = document.getElementById('calendar');

        var calendar = new FullCalendar.Calendar(calendarEl, {
            selectable: true,
            headerToolbar: {
                left: 'prev,next today',
                center: 'title',
                right: 'timeGridWeek,dayGridMonth'  // 'dayGridMonth,timeGridWeek,timeGridDay'
            },
            dateClick: function (info) {
                //alert('clicked ' + info.dateStr);
                console.log(info);
            },
            eventClick: function (start, end, jsEvent, view, resource) {
                console.log(
                    'select',
                    resource ? resource.id : '(no resource)'
                );
            },
            initialView: 'timeGridWeek', 
            allDaySlot: false,
            slotMinTime: "08:00:00",
            slotMaxTime: "21:00:00",
            height: 1000,
            expandRows: true,
            eventRender: function (event, element) {
                element.find('.fc-sticky').attr("id", event.id);
            }
        });

        var event1 = {
            id: "aabbcc", title: 'Sam Smith, \nJohn Doe',
            startTime: "12:00:00", endTime: "14:00:00",
            startRecur: new Date(2023, 3, 4, 12), endRecur: new Date(2023, 5, 4, 12),
            daysOfWeek: [2]
        };

        calendar.addEvent(event1);

        calendar.render();
    }
</script>
javascript fullcalendar fullcalendar-6
1个回答
0
投票

我四处寻找,也试图找到这个问题的答案,最终我找到了一种方法。我不确定这是否是官方方式,因为我找不到! 但是,如果您想获取事件 ID,则可以使用以下方法:-

eventClick: function(info) {
  console.log(info.event._def.publicId)
},

这将为您提供活动 ID,此外您还可以获得其他活动信息,例如标题等

© www.soinside.com 2019 - 2024. All rights reserved.