javascript - 在 Rails 中实现每页 JavaScript 的好方法是什么？

Question

在 Ruby 中尝试新事物 - 在每个页面上，我都在用 jquery 做非常丰富的事情。显然，如果我将所有 jquery 放入 application.js，它会很快变得非常大。

在最后延迟加载特定于页面的 js 文件是否是一种好方法？例如:

<script>

$(document).ready(function() {

  $.getScript("/javascripts/this_pages_scripts.js");

});
</script>

有没有一种 rails 方式可以做到这一点？我知道 new.js.erb 等文件和 ujs，但我仍在谈论更多特定于页面的 js - 你知道，拖放初始化器、对话框创建器等。

非常感谢。

Answer 1

我有两种使用方式:

对于只是添加一点点花哨的微小、琐碎的脚本，我经常将它们内嵌在它们修改的模板中(就像你展示的那样)，因为这样我更容易跟踪.

对于超过一两行的任何内容，我都保持不显眼，但使用 content_for 加载它

我的应用程序布局如下所示(在 HAML 中):

= javascript_include_tag 'jquery.144.min','rails','jquery.tools','application'
= yield :scripts

重要的部分是yield :scripts。然后在我需要一些 javascript 的页面中:

- content_for :scripts do
  = javascript_include_tag 'photo_form'

这会在 header 中加载 javascript，但前提是给定的模板已显示。 content_for 将内容发送到具有相应名称的 yield 方法。

您可以在任何地方粘贴这样的 yield block -- 我在结束 body 标签之前也有一个。 yield/content_for 真的很方便。

请注意，正如 tadman 在评论中指出的那样，任何不必加载到头部的内容都应加载到页面末尾。

最后要注意的是，如果您有更复杂的东西，您还可以在模板和应用程序 View 之间使用实例变量。例如，我的应用程序中有一个位于应用程序布局中的菜单栏。因此，有时我只想在某些页面上触发特定于上下文的按钮或额外的一行按钮。

在我的应用程序布局中，我调用了一个呈现菜单的部分，菜单代码如下所示:

#menubar (normal menu stuff)
  - if @special_menu
    #special_menu

那么，在任何模板中你都可以这样做:

- @special_menu = true

... 对于该页面，将出现给定的菜单。您也可以在 Controller 操作中执行此操作，我有一个 Controller ，我在其中添加了一个前置过滤器，将其中一个菜单标志设置为 true。对于您可能想要有条件地包含的任何复杂的 javascript 内容，您可以执行相同的操作。

我从观看这个 railscast 中得到的大部分想法:http://railscasts.com/episodes/30-pretty-page-title

你应该看看!