如何在FullCalendar事件中使用循环？PHP数组转JS数组报错及优化方案

当前代码的问题 #

你遇到的语法错误来自两个核心问题：

1. 字符串未加引号：title和start的值是字符串类型，直接输出会被JS当作非法标识符，触发语法报错。
2. 事件对象间缺少逗号：foreach循环生成的多个事件对象之间没有逗号分隔，JS解析时会提示“预期','”。

最优解决方案 #

直接利用json_encode将预处理后的PHP数组转换为合法的JS数组，彻底避免手动拼接的语法问题，步骤如下：

1. 预处理PHP数组，匹配FullCalendar字段要求
   先把数据库返回的数组键名映射成FullCalendar需要的字段（你的数据里cal_event对应标题，cal_date对应开始时间）：

$fc_events = [];
foreach ($v_calendar_all_event_list as $event) {
    $fc_events[] = [
        'title'          => $event['cal_event'],
        'start'          => $event['cal_date'],
        'backgroundColor'=> '#f56954',
        'borderColor'    => '#f56954',
        'allDay'         => true
    ];
}

2. 直接在FullCalendar配置中使用转换后的数组
   不需要手动拼接JS代码，直接把json_encode的结果赋值给events字段：

var calendar = new FullCalendar.Calendar(document.getElementById('your-calendar-id'), {
    // 其他配置项（比如header、views等）
    events: <?php echo json_encode($fc_events); ?>
});

calendar.render();

为什么这个方法更优 #

• json_encode会自动处理字符串引号、数组元素间的逗号，完全符合JS语法规范，杜绝手动拼接的语法错误。
• 代码简洁易维护，不需要写复杂的PHP循环拼接JS结构。
• 后续修改事件字段时，仅需调整PHP数组的映射逻辑即可。

内容的提问来源于stack exchange，提问作者Kinesis