如何动态传递实际的javascript数组而不是在eventListener中手动传递？（FullCalendar）

Question

我直接从文档中获取了事件部分代码，该代码显示了如果传递多个源和多个事件将如何获得事件代码。 这看起来很棒，除了我不知道如何动态生成。 我从数据库中获取一个带有php数据的查询，传递给一个javascript数组，需要在相应的标签中打印结果，返回x行数。

我的任何尝试做一段时间，for循环或函数，使得其中的关键字变量（如eventSource，event，Title，Start）变得无效且javascript无法读取，导致我的日历崩溃。 如果它意味着采用数组，那么必须有一种动态生成这个部分的方法吗？ 感谢任何提示。 添加评论到我想“循环”或动态生成的地方。

        <html lang='en'>
  <head>
    <meta charset='utf-8' />
    <script>
      document.addEventListener('DOMContentLoaded', function() {
        var calendarEl = document.getElementById('calendar');

        var calendar = new FullCalendar.Calendar(calendarEl, {
          plugins: [ 'dayGrid' ],

// I want to loop from here...
  eventSources: [

    // your event source
    {
      events: [ // put the array in the `events` property
        {
          title  : 'event1',
          start  : '2010-01-01'
        },
        {
          title  : 'event2',
          start  : '2010-01-05',
          end    : '2010-01-07'
        },
        {
          title  : 'event3',
          start  : '2010-01-09T12:30:00',
        }
      ],
      color: 'black',     // an option!
      textColor: 'yellow' // an option!
    }

    // any other event sources...

  ]
// to here. Passing an array I would have gotten from a database query
// with some integer that goes down until rows = 0
        });

        calendar.render();
      });
    </script>
  </head>
  <body>

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

  </body>
</html>

Answer 1

我会用这个评论，但我没有足够的声誉来做到这一点。 从我看到的，您正在尝试在初始化日历后动态添加事件，但如果您在DOMContentLoaded事件中初始化日历，则无法实现。 这样做会使日历变量无法访问，因为代码的运行范围。 你应该做什么（形成我的）是直接将日历元素和日历本身附加到它们各自的变量而不将它包装在DOMContentLoaded事件监听器中。 所以基本上你的代码现在看起来像这样：

<script>
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
      plugins: [ 'dayGrid' ]});
</script>

然后，您可以通过调用calendar.addEvent()动态添加事件

如何动态传递实际的javascript数组而不是在eventListener中手动传递？（FullCalendar）

问题描述

1 个解决方案

解决方案1
0 2019-04-20 22:21:01

如何动态传递实际的javascript数组而不是在eventListener中手动传递？ （FullCalendar）

问题描述

1 个解决方案

解决方案1 0 2019-04-20 22:21:01

如何动态传递实际的javascript数组而不是在eventListener中手动传递？（FullCalendar）

解决方案1
0 2019-04-20 22:21:01