如何将Ruby集合传递给JavaScript函数供FullCalendar日历插件使用?
实现方案
最简洁可靠的实现方式是直接用Rails内置的JSON序列化能力,不需要手动拼接JavaScript对象:
calendar = $('#calendar').fullCalendar({ header: { left: 'title', center: 'agendaDay,agendaWeek,month', right: 'prev,next today' }, events: <%= @rubyevents.map { |r| {title: r.name, start: r.date} }.to_json.html_safe %> })
代码说明:
- 先用
map遍历@rubyevents集合,把每条记录转换为仅包含title、start字段的哈希,字段值对应你需要提取的r.name和r.date属性 to_json方法会自动把Ruby哈希数组转换为合法的JavaScript数组字符串,不需要手动处理引号、逗号分隔等语法细节- 加
html_safe是为了避免Rails自动转义JSON中的特殊字符,保证输出内容可以直接被JavaScript识别
优化建议
如果r.date是Ruby的日期/时间类型,建议提前转换为ISO8601格式,fullCalendar可以直接识别该格式,时区兼容性更好:
<%= @rubyevents.map { |r| {title: r.name, start: r.date.iso8601} }.to_json.html_safe %>
如果你确实要使用手动循环的写法,需要修正你原有代码的几个问题:
e[title]中的title需要加引号,否则会被识别为JavaScript变量而非对象属性名- 不需要给属性值包裹匿名函数,直接赋值即可
- 字符串类型的属性值需要主动加引号,否则会触发JS语法错误
手动拼接的写法很容易出现语法问题,更推荐使用JSON序列化的方案。
内容的提问来源于stack exchange,提问作者MisterCal
相关产品推荐
相关产品推荐

