FullCalendar功能不在范围中

发布于 2025-02-02 14:06:19 字数 2430 浏览 5 评论 0原文

我正在尝试从范围外部与FullCalendar进行互动。例如,我正在尝试更改事件的颜色。另一个示例是简单地显示带有当前视图的警报。

捕获是,我正在使用一种称为FileMaker的工具,该工具具有在JavaScript内部执行功能而不是HTML内部的按钮。

据我所知,我没有可以使用的活动听众。有什么方法可以使日历在全球范围内呈现?

<!DOCTYPE html>
<html lang='en'>

    <head>

        <meta charset='utf-8' />

        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fullcalendar/[email protected]/main.min.css"></style>
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fullcalendar/[email protected]/main.min.css"></style>

        <script src="https://cdn.jsdelivr.net/npm/@fullcalendar/[email protected]/main.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/@fullcalendar/[email protected]/main.min.js"></script>

        <script>

            document.addEventListener
            (
                'DOMContentLoaded', function()
                {
                    var calendarEl = document.getElementById('calendar');

                    var calendar = new FullCalendar.Calendar
                    (
                        calendarEl,
                        {
                            plugins: [ 'dayGrid' ]
                            ,events: 'https://fullcalendar.io/api/demo-feeds/events.json'
                        }
                    );

                    calendar.render();
                }
            );

            function changeColour(id)
            {
                var event = calendar.getEventById(id);
                event.setProp( color, '#000000' );
            }

        </script>

    </head>
    
    <body>
        <div id='calendar-container'>
            <div id='calendar'></div>
        </div>
    </body>

</html>

I am trying to interact with Fullcalendar from outside of scope. For example below, I am trying to change the colour of an event. Another example would be to simply display an alert with the current view.

The catch is, that I am using a tool called FileMaker which has the ability to Perform A Function Inside Javascript rather than a button inside of the HTML.

As far as I am aware, I don't have an event listener I can use. Is there a way I can have the calendar render globally?

<!DOCTYPE html>
<html lang='en'>

    <head>

        <meta charset='utf-8' />

        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fullcalendar/[email protected]/main.min.css"></style>
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fullcalendar/[email protected]/main.min.css"></style>

        <script src="https://cdn.jsdelivr.net/npm/@fullcalendar/[email protected]/main.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/@fullcalendar/[email protected]/main.min.js"></script>

        <script>

            document.addEventListener
            (
                'DOMContentLoaded', function()
                {
                    var calendarEl = document.getElementById('calendar');

                    var calendar = new FullCalendar.Calendar
                    (
                        calendarEl,
                        {
                            plugins: [ 'dayGrid' ]
                            ,events: 'https://fullcalendar.io/api/demo-feeds/events.json'
                        }
                    );

                    calendar.render();
                }
            );

            function changeColour(id)
            {
                var event = calendar.getEventById(id);
                event.setProp( color, '#000000' );
            }

        </script>

    </head>
    
    <body>
        <div id='calendar-container'>
            <div id='calendar'></div>
        </div>
    </body>

</html>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

奶气 2025-02-09 14:06:19

尝试在Domcontentloaded功能中移动ChangeColour函数,然后将其附加到窗口中,以

document.addEventListener('DOMContentLoaded', function(){
    var calendar = new FullCalendar....
    ....
    window.changeColour = function(id){
        var event = calendar.getEventById(id);
        event.setProp( color, '#000000' );
    }
}

这种方式可以访问日历

Try moving your changeColour function inside the DOMContentLoaded function and attaching it to the window explicitly

document.addEventListener('DOMContentLoaded', function(){
    var calendar = new FullCalendar....
    ....
    window.changeColour = function(id){
        var event = calendar.getEventById(id);
        event.setProp( color, '#000000' );
    }
}

That way it should be able to access calendar

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文