Rails 4 Javascript:图像路径出现问题

Question

我试图让背景图像每6秒更改一次,它总是出现404错误:

例如,以下内容出现在JS控制台中

http://localhost:3000/app/assets/images/ggb_mist.png 404 (Not Found) 

为了简化这一点,我试着background-color确保它正常工作.见下文:

$(document).ready(function() {
  function testing() {
    $('.holder').css('background-color', 'red');
  };
});

以上工作.现在,当我尝试对图像执行相同操作时(位于app/assets/images/imagefilenamehere.png我总是遇到404错误.我尝试过:

filenamehere.png
../assets/images/filenamehere.png
../app/assets/images/filenamehere.png
../images/filenamehere.png

以下为什么不工作？

$('.holder').css({'backgroundImage':'../assets/images/filenamehere.png'});

关于此事的任何意见都表示赞赏.

Answer 1

您可以使用.erb(嵌入式ruby)扩展来允许.js文件中的rails path helpers :

1)您保存原始文件(my_script.js)my_script.js.erb与图像路径助手一样:

$('.holder').css({"background-image":"<%= asset_path('filenamehere.png') %>"});

此外,请确保正确设置资产管道:

来自Rails Asset Pipeline指南(http://guides.rubyonrails.org/asset_pipeline.html)

2)你的javascript文件(my_script.js.erb)在里面:

app/assets/javascripts/
lib/assets/javascripts/
vendor/assets/javascripts/
vendor/assets/somepackage/

3)您的文件在清单中引用(可能app/assets/javascripts/application.js):

//= require my_script

Answer 2

这解决了我的问题:guides.rubyonrails.org/asset_pipeline.html的2.3.1节

$('.holder').css("background-image","url(<%= asset_path('tree-rays.jpg') %>)");

请注意,tree-rays.jpg它位于app/assets/images(Rails 4应用程序)中.