大家好,这个问题困扰我一段时间了。
一般来说,跟 jQuery
一起用的时候,要把 turbolinks
放在 application.js
最后,
gem 'jquery-turbolinks'
/app/assets/javascripts/application.js
//= require jquery
//= require jquery.turbolinks
//= require jquery-ui
$( document ).ready(function() {
console.log( "ready!" );
......
});
//= require turbolinks
然后,为了让 js 加载不会影响到网页呈现的速度,我们一般会把 javascript_include_tag
放在末尾。
/app/views/layouts/application.html.erb
<!DOCTYPE html>
<html>
<head>
<title>Ruby China</title>
...
<%= stylesheet_link_tag "application", media: "all", "data-turbolinks-track" => true %>
<%= csrf_meta_tags %>
</head>
<body class="Site">
...
<%= yield %>
<%= render partial: 'common/footer' %>
<%= javascript_include_tag "application", "data-turbolinks-track" => true %>
</body>
</html>
so far so good. 现在问题来了。如果我在某个特定页面要在 footer
之上添加一个 $( document ).ready(function() {...});
,结果这时候 jQuery
都还没有加载呢。如果我把它添加到 ·application.js
,也有问题,首先,这不是一个全局使用的功能,其次,在不用这个功能的页面因为找不到特定的 div (id 或 class),也会报错。
结果折腾了一圈,还是要把 javascript_include_tag
放在 <header>
里面,stylesheet_link_tag
的下面。
还有个讨巧的方法,就是在 /app/views/layouts/application.html.erb
文件末尾,加上判断语句:
<body class="Site">
...
<%= yield %>
<%= render partial: 'common/footer' %>
<%= javascript_include_tag "application", "data-turbolinks-track" => true %>
<% if controller_name=='pages' && action_name=='index' %>
<script>
...
</script>
<%end%>
个人觉得太不处女座了,在这放一堆跟 layout
无关的逻辑代码。
js 放在哪,有没有谁有更好的建议,谢谢!
PS: 帖子最上面的 turbolinks
用法是否正确,也请大家斧正。