如何防止加载不正确的.js.coffee文件

Question

在我的rails应用程序中，似乎所有.js.coffee文件都被加载到每个页面，无论如何。我遇到的问题是正在加载locations.js.coffee文件，然后在函数中返回一个空值，因为locations.js.coffee文件正在查找的表不存在于任何其他页面上不是位置页面。

注意：在每个文件中：users.js.coffee，locations.js.coffee和campaigns.js.coffee我分别放置了行.log（＆＃34; users.coffee）已加载＆＃34;），console.log（＆＃34; locations.coffee已加载＆＃34;）和console.log（＆＃34; campaigns.coffee加载＆＃34;）以查看它们是否已加载 < / p>

例如，刷新位置页面会成功输出到控制台：

但冒险到用户或广告系列页面会尝试加载文件locations.js.coffee，但由于用户或广告系列中不存在locatrions.js.coffee所依赖的ID为#restaurantLocations的表格，结果错误是：

对于文件locations.js.coffee中的行table.columns().eq(0).each (colIdx)。

如何防止此错误或仅允许为正确的页面加载正确的文件并阻止其他文件加载？

（剩余的locations.js.coffee代码）：

jQuery ->
  console.log("locations.coffee loaded")

  # Setup - add a text input to each footer cell
  $("#restaurantLocations tfoot th").each ->
    title = $("#restaurantLocations thead th").eq($(this).index()).text()
    $(this).html "<input type=\"text\" placeholder=\"Search " + title + "\" />"

  # DataTable
  table = $("#restaurantLocations").DataTable()

    # Apply the search
  table.columns().eq(0).each (colIdx) ->
    $("input", table.column(colIdx).footer()).on "keyup change", ->
      table.column(colIdx).search(@value).draw()

  # Hiding the id column, but for use for data manipulation
  table.column( 0 ).visible( false )

  # Allowing multi-select
  $("#restaurantLocations tbody").on "click", "tr", ->
    $(this).toggleClass "selected"

  # Allowing deletion (works)
  $("#deleteLocations").click ->
    multiSelected = table.rows(".selected").data()
    table.rows(".selected").remove().draw false
    for locationSelected in multiSelected
      id = locationSelected[0]
      $.ajax({
        url: "/locations/" + id,     # Note: $.ajax setup works as setting /locations/(id number) will allow deletion
        type: "post",
        dataType: "json",
        data: {"_method":"delete"}
      })

  # Conditional 'Select All' (works)
  $("#selectAllLocations").click ->
    table.$('tr', {"filter":"applied"}).addClass "selected"

  # Deselecting all (works)
  $("#deSelectAllLocations").click ->
    table.$("tr").removeClass "selected"

Answer 1

默认情况下，Rails包含app/assets/javascripts/application.js的文件，该文件需要app/assets/javascripts中的所有其他文件。然后，默认应用程序布局包括该文件。

还有其他方法可以整理您的资产，包括controller-specific assets。这些都需要自定义资产配置。

但是，我不建议这样做。如果您能够以可以包含在每个页面上的方式编写JavaScript，并且不在不需要的页面上执行任何操作，那就更好了。

有很多方法可以实现这一点：一个简单的方法是使用jQuery在页面主体上或页面上的其他位置查找特定的类。

在上面的代码中，您需要做的只是将if $("#restaurantLocations").length > 0包裹在整个事物中（但在jQuery回调函数内）。

这给你带来了一些好处：

• 这是一个更简单的配置，坚持使用Rails默认约定，更容易理解。
• 您的应用更改更具弹性。如果您需要在新页面上使用该JavaScript，或者在现有页面上停止使用该JavaScript，则只需添加或删除相关类（或您正在搜索的任何标记），而不是对您的脚本标记或资产清单中的require语句。
• 避免重复。如果不同页面上的脚本共享公共依赖项，则需要在两个顶级脚本中都需要它们。
• 对用户来说更好，因为在资源预编译之后，您最终会在应用中的每个页面上使用单个连接和压缩文件。用户只需下载一次，然后导航到其他页面时，它将被加载到缓存中。除非大量的JavaScript仅限于大多数用户从不访问的页面，否则将所有内容组合起来效率会更高。

阅读The Asset Pipeline Rails Guide，了解有关资产如何在Rails中运行的详细信息。