在Rails中实现每页JavaScript的好方法是什么?

时间:2011-04-08 14:06:24

标签: javascript jquery ruby-on-rails

在Ruby中尝试新东西 - 在每个页面上我都在用jquery做很丰富的东西。显然,如果我把所有的jquery都放到application.js中,它会很快变大。

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

<script>

$(document).ready(function() {

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

});
</script>

这样做有轨道方式吗?我知道new.js.erb等文件和ujs,但我仍在谈论更多特定于页面的js - 你知道,拖放初始化器,对话创建器等等。

非常感谢。

3 个答案:

答案 0 :(得分:12)

我使用两种方法:

对于那些只是添加一点点眼花缭乱的微小,琐碎的脚本,我经常将它们内嵌在他们修改的模板中(就像你已经显示的那样),因为我更容易跟踪这种方式

对于任何超过一两行的内容我保持不引人注目,但使用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'

这会在标头中加载javascript,但前提是只显示给定的模板。 content_for使用相应的名称向yield方法发送内容。

你可以在任何地方坚持一个屈服块 - 我在关闭身体标签之前也有一个。 Yield / content_for非常方便。

请注意,tadman在评论中指出,任何不必在头部加载的内容都应该在页面末尾加载。

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

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

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

所以,然后在任何模板中你可以做到:

- @special_menu = true

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

我观看此视频广播时获得的大多数观点都是:http://railscasts.com/episodes/30-pretty-page-title

你应该看看!

答案 1 :(得分:0)

设置符号以表示标题中的文件名并在控制器中调用

@script = "prototype"

然后在视图中:

<%= javascript_include_tag @script %>

或加载多个

@scripts = ["prototype", "dropdown"]

然后

<% @scripts.each do |s| %>
  <%= javascript_include_tag s %>
<% end &>

答案 2 :(得分:0)

我个人使用requireJS和自定义功能检测库来处理此问题。

然后我有一行在layout / master / shared视图页面中包含requirejs脚本及其data-main属性。 (我不熟悉rails,但它与其他任何MVC都一样)。

我在其他地方写了一个很好的答案。你或许可以找到它。