javascript - 轨道 4 Javascript : Having trouble with image paths

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 路径助手:

1) 使用图像路径助手将原始文件 (my_script.js) 保存为 my_script.js.erb:

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

此外，请确保您的 Assets 管道设置正确:

来自 Rails Assets 管道指南 ( 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) list 中引用了您的文件(可能是 app/assets/javascripts/application.js):

//= require my_script