如何在 Heroku 上的 Rails 4 中引用 javascript 中的图像

Posted 2023-03-29

【中文标题】如何在 Heroku 上的 Rails 4 中引用 javascript 中的图像

【英文标题】：How to reference images in javascript within Rails 4 on Heroku

【发布时间】：2014-03-01 09:47:06

【问题描述】：

我正在尝试通过 javascript 链接图像。单击缩略图时，较大的图像会变为相应的图像。

（我已经删除了一些对这个问题不重要的类。）

缩略图：

    <%= image_tag "uppdrag/thumbs/katja01.png", :class => "ids", :id => "katja01.png" %>
    <%= image_tag "uppdrag/thumbs/katja02.png", :class => "ids", :id => "katja02.png" %>
    <%= image_tag "uppdrag/thumbs/katja03.png", :class => "ids", :id => "katja03.png" %>

变化的图像：

    <%= image_tag "uppdrag/katja01.png", :class => "", :id => "idstudio" %>

Javascript：

$(".ids").click(function() 
  var id = $(this).attr('id');
    $('#idstudio').fadeOut(300, function()
  $('#idstudio').attr('src','/assets/uppdrag/' + id).bind('onreadystatechange load', function()
     if (this.complete) $('#idstudio').fadeIn(300);
  );
);
);

在 localhost:3000 上一切正常，但是当预编译并上传到 heroku 并且图片的名称发生变化时，缩略图上 id 上的名称不再正确，我无法弄清楚了解如何为 id 上的图片获取正确的名称。

卡尔干杯

【参考方案1】：

您应该可以使用asset_path 助手。

http://guides.rubyonrails.org/asset_pipeline.html#coding-links-to-assets

<%= image_tag "uppdrag/thumbs/katja01.png", :class => "ids", :id => asset_path "katja01.png" %>

等

【讨论】：

唯一发生的事情是我在文件名 id="/katja02.png" 之前得到一个“/”。我确实必须有括号，例如。 :id =>asset_path("katja02.png")，但我猜这不重要。

正在开发中吗？如果正确，它将调整为生产中带有指纹的资产的新路径名。

不，不幸的是在 Heroku 上。我需要做一些配置才能工作吗？普通图片可以。

其实你是对的。我省略了路径，例如。 :id => 资产路径（“uppdrag/katja02.png”）。愚蠢的错误。更改 javascript 后现在可以正常工作了。