如何使用 Ruby On Rails 创建动态 JavaScript？答案

【问题标题】：How to create dynamic javascript with Ruby On Rails?如何使用 Ruby On Rails 创建动态 JavaScript？
【发布时间】：2015-02-13 19:12:13
【问题描述】：

我正在试验 jQuery FullCalendar 和 Ruby On Rails，我有一个名为 Player 的模型。我想在索引模板上为每个玩家渲染一个日历。

$('#player1_calendar').fullCalendar({
        // put your options and callbacks here
})

在视图上渲染日历

我怎样才能为每个播放器动态添加一个日历，以便我可以像这样调用它：

<div id="player1_calendar"></div>
<div id="player2_calendar"></div>
<div id="player3_calendar"></div>
...

【问题讨论】：

【解决方案1】：

我会以不同的方式处理这个问题。

问题是，Rails 能够以 JSON 格式返回数据，这是 JavaScript 的原生数据格式。也就是说，您可以编写静态 JS 并向其添加动态 JSON 数据端点。

一般算法如下：

添加一个 JSON 端点，该端点提供在每种特定情况下决定选项所需的所有数据：这可能是一个端点，为给定页面上的所有玩家返回数据
在 HTML 中突出显示集合的根标签：对于与行为相关的选项，我使用 data-attributes；您甚至可以在属性值中提供端点的 URL：关键是，您应该能够设计一个选择器来找到这些
编写静态 JavaScript，通过上面设计的选择器找到所有标签，查询所需数据，然后使用接收到的数据以正确的选项调用 fullCalendar

这是消除对动态 JavaScript 需求的一般方法。对于单一位置的解决方案，这显然是矫枉过正，但对于频繁使用，这更方便，因为它允许您在不生成普通 JS 甚至将 JS 插入页面的情况下应用您的行为，但仅由 DOM 触发。

【讨论】：

【解决方案2】：

也许完全用 Javascript 来做这件事会更容易：

为所有日历元素添加一个类：

<div id="player1_calendar" class="player-calendar"></div>

然后遍历所有这些并附加您的完整日历：

$('.player-calendar').each(function(idx, calendar) {
    $(calendar).fullCalendar({});
});

【讨论】：