使用 Rails 资产管道时选择性运行 javascript 的最佳方法是什么？

Question

Rails 资产管道有其问题，但是连接所有 JS、缩小它并为其提供远期过期标头的好处是很难忽视的。

我的 Rails 应用程序中的许多 JS 都特定于单个操作。例如，我们有一个复杂的页面供员工输入客户订单。

在 Rails 3.1 之前，我将特定于操作的代码放在一个不同的 JS 文件中，仅在需要时才加载。现在我所有的JS都一直在服务。仅在需要时运行订单输入 JS 的最佳方法是什么？

目前我正在检查订单输入 DOM 元素，但这意味着 DOMready 上将运行许多不必要的函数。

下面是订单输入代码中的一段 CoffeeScript 片段，该模式在大约 20 个文件中重复出现。有更好的办法吗？

$ ->
  window.app.draft = new app.DraftOrder()

@module 'app', ->
  class @DraftOrder
    constructor: ->
      @items = $('table.draft-items tr')
      return if @items.size() == 0
      @initEvents()
      @move_first()
    initEvents: ->
      # foo
    otherMethod: ->
      # bar

Answer 1

我喜欢将页面特定的 JS 封装在闭包中，并在应用程序模板中插入代码，以便我有选择地执行它。

因此，“事件”控制器的页面特定 js 可能如下所示：

events = {
  onload: function() {
    // put any page-specific onload code here
  },
  someOtherRoutine: function() {
  }
}

在我的应用程序模板 (application.html.erb) 中，我添加：

<%= javascript_tag do %>
  window.controller_name = <%= params[:controller] %>;
  window.action_name = <%= params[:action] %>;
<% end%>

然后，在 application.js 中（假设您使用 jQuery）：

$(function() {
  if(controller_name === 'events'){
    events.onload();
  }
  else if(controller_name === 'anothercontroller'){
    anothercontroller.onload();
  }

  // put any global onload functionality here...
});

这具有额外的优点为所有页面特定的 JS 提供一种穷人的命名空间。

可能有一种更惯用的rails/javascript 方法可以做到这一点；我主要不是 JS 程序员，但我正在学习非常喜欢这门语言......

Answer 2

它仅包含您的所有 javascript 文件，因为您的 application.js 文件中有此行：

//= require_tree .

如果您将其删除，它将仅包含您特别需要的文件。如果您指定文件夹的名称（而不是 .），那么您可以在其中放置要“自动包含”的文件。您可以在Rails 指南中了解更多相关信息。例如，您的 application.js 文件可能如下所示：

//= require jquery_ujs
//= require main

然后，您可能有一个 order_entry.js 文件，其中只包含您想要的代码。当然，您可以像以前一样链接到这些：

对于 application.js：

<%= javascript_include_tag "application" %>

对于新的 order_entry.js：

<%= javascript_include_tag "order_entry" %>