简体   繁体   English

对如何在Ruby on Rails中使用普通JavaScript感到困惑

[英]Confused about how to use vanilla JavaScript with Ruby on Rails

I have two views, one called dashboard and the other called home , both have their respective index.htm.erb files. 我有两个视图,一个称为仪表板 ,另一个称为home ,都有各自的index.htm.erb文件。 The corresponding JavaScript files in the assets/javascripts folder do not seem to map to these views. 资产/ javascripts文件夹中的相应JavaScript文件似乎未映射到这些视图。 For example, when I run an alert in home.js and then navigate to dashboard.html.erb the alert still runs. 例如,当我在home.js中运行警报,然后导航至dashboard.html.erb时 ,警报仍在运行。

How do I remedy this to get the functionality I am looking for? 我该如何补救才能获得所需的功能?

I am confused as to how to write page specific raw JavaScript in Rails. 我对如何在Rails中编写页面特定的原始JavaScript感到困惑。

Edit : I could use the public folder but I had some ancillary issues with that and hence why I started using the files in the assets folder. 编辑 :我可以使用公用文件夹,但与此同时存在一些辅助问题,因此为什么我开始使用资产文件夹中的文件。

One of Rails' "opinions" about javascript is that it should be all concatenated into a single file ( application.js ), minified, and served to the client. Rails关于javascript的“观点”之一是,应将其全部串联到一个文件( application.js )中,将其缩小并提供给客户端。 This is an effort to minimize the number of requests the client needs to make when accessing your application (the goal is to have only three, one for your html, one for css, and one for javascript [excluding whatever images may be on the page.]) 这样做是为了最大程度地减少访问应用程序时客户端需要发出的请求数量(目标是只有三个,一个用于html,一个用于css,一个用于javascript [不包括页面上的任何图像。])

If you look in your application.js, you'll see a note saying that it is a 'manifest' file, and a line that looks like 如果您查看application.js,则会看到一条注释,指出该文件是“清单”文件,并且一行如下所示

require_tree .

Which says "load every javascript file in this folder into this file" 上面写着“将该文件夹中的每个javascript文件加载到该文件中”

In order to load up some page-specific javascript, you'd need to 为了加载某些页面特定的javascript,您需要

  • put a separate javascript file into app/assets/javascripts [call it custom.js, say] 将一个单独的javascript文件放到app/assets/javascripts [称其为custom.js]
  • stub out loading that file into the application manifest by writing stub custom in application.js 通过在application.js编写stub custom存根,将文件加载到应用清单中
  • Include the custom javascript manually in your view (or, more better probably, a layout which renders your view): <%= javascript_include_tag 'custom' %> 在视图中手动添加自定义javascript(或更可能是呈现视图的布局): <%= javascript_include_tag 'custom' %>

However, I'd encourage you to look at whether you really need to separate this javascript, or whether it's a problem that can be solved by simply localizing your script to the page(s) it's intended for, which will keep the same functionality and keep your loads times ever-so-slightly faster. 但是,我建议您考虑一下是否真的需要分离此javascript,或者是否可以通过将脚本仅本地化到其预期的页面来解决此问题,这将保持相同的功能和保持您的加载时间如此之快。

$('body.some_custom_class').ready(function() { alert('I'm running on this page!'); });

you can use content_for in your layout 您可以在布局中使用content_for

app/views/layouts/application.html.erb 应用程序/视图/布局/ application.html.erb

<html>
  <head>
     <title> ...</title>
     ....
     <%= yield :javascript %>
     ....
    </head>
    ....
 </html>

and on your view app/views/home.html.erb 并在您的视图上app / views / home.html.erb

 <% content_for :javascript do %>
    <%= javascript_include_tag 'home' %>
 <% end %>
 other view content

you would also need to look at application.js and remove the //= require tree . 您还需要查看application.js并删除//= require tree . line 线

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM