在Rails中包含特定于页面的Javascript的正确方法
我想包括这个,例如:
jQuery(document).ready(function($) { $('#my-modal').modal(options) });
在rails应用程序中的一个特定位置。 在我的例子中,该文件名为views / modals / mymodal.html.erb。 那里只有那里。
如果不把它放在所有页面上,如果我把它放在资产中就会发生,我无法弄清楚如何做到这一点。 谢谢!
这些是一些有用的技巧
#1带文件js
- 为您的javascript创建文件
your.js
- 在特定的布局上调用文件
your.js
- 删除
//= require_tree .
在application.js
-
on config/application.rb
上将your.js添加到资产percompile:config.assets.precompile += %w( your.js )
#2放入特定文件非布局(不推荐)
在mymodal.html.erb
上使用javascript标记放置你的js脚本
#3使用if..else ..
将您的js脚本放入layout/yourlayout.html.erb
并使用if.. else..
logic。
例子:
<% if current_page?(yourspecific_path) %> <% end %>
在这里阅读更多关于current_page?
或者使用request.fullpath
获取当前的完整路径
例子:
<% if request.fullpath == yourspecific_path %> <% end %>
在这里阅读更多关于request.fullpath
如果您希望将脚本放入文件.js
也可以组合#1和#3
干杯
其中一个解决方案是将我们的javascript插入到自己的文件中: Reference Link
例如 :
// app / assets / javascripts / alert.js
alert("My example alert box.");
并且只在我们希望它执行的视图中包含此文件:
<%# app/views/page/contact.html.erb %> <%= javascript_include_tag "alert" %> Contact
This is the contact page
并且不要忘记将新文件包含在要编译的文件列表中:
# config/environments/production.rb config.assets.precompile += %w( alert.js )
给定要包含的JS文件名为my_modal.js
:
-
将放置在
assets/javascripts
中的JS
文件放在assets/javascripts
内的某个目录中,例如application
。 -
更改行
//= require_tree .
在您的application.js
//= require_tree application
application.js
(它阻止在每个页面上加载my_modal.js
)。 -
将
my_modal.js
放在assets/javasctripts
-
在
my_modal.js
添加到config.assets.precompile
数组(config assets.precompile += ['my_modal.js']
)。 -
将
javascript_include_tag 'my_modal'
要包含此文件的视图中
您可以访问Rails指南以供参考。
晚会,但对于今天看到这个的人,我想我已经想出了更好的东西。
Punchbox Gem for Rails
有了这个,您可以编写如下代码:
class Post { controller() { // Runs on every action } index() { // Runs on just the index action } } Punchbox.on('Posts', Post);
(您也可以创建一个对象而不是一个类。请参阅文档)
我在这里更深入地写了这篇文章: https : //kierancodes.com/blog/page-specific-javascript-in-rails-4
jquery-readyselector是一个“扩展$().ready()
的插件,为页面特定的脚本提供方便的语法”
-
安装jquery-readyselector
-
创建一些CSS类
-
将您的JavaScript范围扩展到您的页面
$("#my-modal").ready(function() { $('#my-modal').modal(options) });
回答更多信息如何加载页面特定的rails 4 js文件?