Rails js文件和页面特定的js
在rails上，我将所有的JavaScript文件放入应用程序的js文件中。
//= require jquery
//= require jquery_ujs
//= require dropzone
//= require jquery.cookie
//= require toastr
//VENDOR JS BEGINS
//= require pace/pace.min
//= require modernizr.custom
//= require jquery-ui/jquery-ui.min
//= require boostrapv3/js/bootstrap.min
//= require jquery/jquery-easy
//= require jquery-unveil/jquery.unveil.min
//= require jquery-bez/jquery.bez.min
//= require jquery-ios-list/jquery.ioslist.min
//= require jquery-actual/jquery.actual.min
//= require jquery-scrollbar/jquery.scrollbar.min
//= require bootstrap-select2/select2.min
//= require switchery/js/switchery.min
//= require imagesloaded/imagesloaded.pkgd.min
//= require jquery-isotope/isotope.pkgd.min
//= require classie/classie
//= require codrops-stepsform/js/stepsForm
//= require bootstrap-datepicker/js/bootstrap-datepicker然后，我调用application.html.erb头部中的javascript作为；
...
<head>
..
<%= javascript_include_tag 'application' %>
..
</head>
...然后我检查了网站的速度，建议我把这个JS调用发送到body。我知道我应该BTW。但问题出在页面特定的JS代码上。
假设我有一个home.html.erb，用户可以选择date。所以我把datapicker代码放到这个页面中。
如果我将<%= javascript_include_tag 'application' %>放在主体的底部，这一次是因为jquery和datepicker还没有加载，所以特定于页面的JS提供了no method error
最好的方法是什么？
回答 3
Stack Overflow用户
发布于 2016-12-21 04:58:14
在body结束标记之前，紧跟在<%= javascript_include_tag 'application' %>之后
添加<%= yield :page_scripts %>
然后在特定视图中的任意位置(通常在顶部)使用以下命令设置脚本：
<% content_for :page_scripts do %>
<script>alert( "My nice scripts..." );</script>
<% end %>Stack Overflow用户
发布于 2017-07-04 07:23:37
在http://brandonhilkert.com/blog/page-specific-javascript-in-rails/上有一个非常好的答案。
基本上，您希望打开app/views/layout/application.html.erb，并说服它在每次呈现页面时为您提供控制器和视图信息。为此，您需要将body标记从
<body>
<%= yield %>
</body至
<body class="<%= controller_name %> <%= action_name %>">
<%= yield %>
</body>因此，当rails呈现body标记时，它现在将为控制器添加一个类，并在控制器中添加一个操作。
假设您有一个名为static_pages的控制器，而static_pages控制器具有
def home
end当rails呈现视图/页面主页时，它现在将在主体标记中添加一个static_pages类和一个 home 类。
<body class="static_pages home">
the home view is rendered here
</body>这将是站点范围的更改，因此，如果从用户控制器转到索引页面/视图，则主体标记将为：
<body class="users index">
the index view is rendered here
</body>现在，创建一个名为vendor/assets/javascripts/jquery-readyselector.js的文件，其中包含：
(function ($) {
var ready = $.fn.ready;
$.fn.ready = function (fn) {
if (this.context === undefined) {
// The $().ready(fn) case.
ready(fn);
} else if (this.selector) {
ready($.proxy(function(){
$(this.selector, this.context).each(fn);
}, this));
} else {
ready($.proxy(function(){
$(this).each(fn);
}, this));
}
}
})(jQuery);必须在application.js中正确引用该文件
...
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require jquery-readyselector
//= require_tree . 所有这些都完成后，您可以通过为您想要测试的视图创建一个简单的警报来测试它，如下所示：
// app/assets/javascripts/static_pages_home.js
$(".static_pages.home").ready(function() {
return alert("You should only see this on the static pages home page.");
});
// app/assets/javascripts/user_index.js
$(".users.index").ready(function() {
return alert("You should only see this on the users index page.");
});您还可以通过不引用操作来指定特定的脚本控制器。
$(".users").ready(function() {
return alert("You should only see this on a users controller controlled page.");
});Stack Overflow用户
发布于 2017-07-11 15:00:47
你也可以看看Page-specific Javascript for Rails done right。这值得一看！
安装之后。让我们看一下示例代码。
var ArticlesController = Paloma.controller('Articles');
ArticlesController.prototype.edit = function(){
// Handle edit article
};这意味着如果你有文章控制器的编辑操作页面。那么只有javascript会被触发。这不会在其他控制器操作中触发。
https://stackoverflow.com/questions/41238020
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号