在 rails 中使用 content_for 包含内联 javascript
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2464595/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Including inline javascript using content_for in rails
提问by TenHyman
I am using content_for and yeild to inject javascript files into the bottom of my layout but am wondering what the best practice is for including inline javascript. Specifically I'm wondering where the put the script type declaration:
我正在使用 content_for 和 yeild 将 javascript 文件注入我的布局底部，但我想知道包含内联 javascript 的最佳实践是什么。具体来说，我想知道脚本类型声明放在哪里：
<% content_for :javascript do %>
<script type="text/javascript"> ... </script>
<% end %>
or
或者
<% content_for :javascript do %> ... <% end %>
<script type="text/javascript">
<%= yield :javascript %>
</script>
<% end %>
I am using the first option now and wondering if it is bad to include multiple
我现在使用第一个选项，想知道包含多个选项是否不好
...declarations within one view. Sometimes I have partials that lead to this.
一个视图中的声明。有时我有导致这个的部分。
回答by Tilendor
I much prefer to have the layout's yield look like this:
我更喜欢让布局的产量看起来像这样：
<html>
<!-- other stuff -->
<body>
<!-- other stuff -->
<%= yield :javascript %>
</body>
</html>
Then in a view you can write:
然后在视图中你可以写：
<% content_for :javascript do %>
<script type='text/javascript'>
function doMagic() {
//Mind-blowing awesome code here
}
</script>
<% end %>
<!-- More view Code -->
<%= render :partial => "sub_view_with_javascript" %>
And in the partial _sub_view_with_javascript.html.erb you can also write:
在部分 _sub_view_with_javascript.html.erb 中，您还可以编写：
<% content_for :javascript do %>
<script type='test/javascript'>
function DoMoreMaths() {
return 3+3;
}
</script>
<% end %>
My reasoning for this approach is that the yield and content_for are in different files. It is not DRY to put the script tag in for every content_for butit allows the syntax highlighter to recognize the change in language in each file and helps me there.
我对这种方法的推理是 yield 和 content_for 在不同的文件中。为每个 content_for 放置脚本标签并不枯燥，但它允许语法高亮器识别每个文件中的语言变化并在那里帮助我。
If you have multiple content_for calls in a single file to the same symbol (in our case, :javascript) I would consider consolidating them all to the top one, but its perfect for use with partials.
如果您在单个文件中有多个 content_for 调用到同一个符号（在我们的例子中，:javascript），我会考虑将它们全部合并到顶部，但它非常适合与部分一起使用。
And HTML is perfectly happy to have as many script blocks as you would like. The only possible gotcha is when working with the code in developer tools like firebug, it takes a little bit more time to find the right script block for your function. This only happens for me when I need to set a javascript breakpoint to debug.
HTML 非常高兴拥有任意数量的脚本块。唯一可能的问题是在使用 firebug 等开发人员工具中的代码时，需要多花一点时间为您的函数找到正确的脚本块。这仅在我需要设置 javascript 断点进行调试时发生。
回答by plehoux
Here's a solution if you really want to keep the number of < script> tag minimal in your html and still be able to have your IDE highlight javascript. It's really useful with jquery if you want only one $(document).ready() call in your html or with facebook js api to call js when the api is loaded, etc...
如果您真的希望在您的 html 中保持 <script> 标记的数量最少，并且仍然能够让您的 IDE 突出显示 javascript，这里有一个解决方案。如果您只想在 html 中调用 $(document).ready() 或使用 facebook js api 在加载 api 时调用 js，这对 jquery 非常有用，等等...
layout_helper.rb :
layout_helper.rb ：
def javascript_jquery_ready(script)
content_for(:javascript_jquery_ready) {
script .gsub(/(<script>|<\/script>)/, "")
}
end
application.html.erb :
application.html.erb :
<script>
$(document).ready(function(){
<%= yield(:javascript_jquery_ready) %>
});
</script>
any view file:
任何视图文件：
<% javascript_jquery_ready (capture do %>
<script>
$('#share_access_link').click(function(){
$('#share_access_form').slideToggle();
});
</script>
<% end) %>
This solution enable me to keep my code organise and readable in my IDE since I don't need to create partial for every js code. Even if it change nothing for the end user the html result is cleaner.
这个解决方案使我能够在我的 IDE 中保持我的代码组织和可读，因为我不需要为每个 js 代码创建部分代码。即使它对最终用户没有任何改变，html 结果也更清晰。
