需要 Rails 应用程序中原生 HTML 的图像路径

Question

Rails 4、Ruby 2、jQuery 1.11

我的应用有使用 DataTables 构建的表。我正在使用 jQuery 来修改这些表的 HTML。我正在尝试添加资产/图像中的图像，但我似乎无法确定访问它所需的路径。由于我在预处理 HTML 后对其进行编辑，因此它是原生 HTML，我无法在其中使用 Rails 变量。

我可以让 Rails 识别图像的存在，或者更具体地说是 RubyMine。由于我在 JavaScript 中，路径“../images”可以访问图像。但是，这不适用于 HTML。

我的问题是，鉴于图像位于 app/assets/images 中，我必须为原生 HTML 指定什么路径才能访问该图像？

$('input[type=search]').each(function () {
    var $this = $(this);
    $this.addClass("theSearch");
    $('.theSearch')
        .append('<img id="clrImg" class="clrSearch" src="../images/DeleteRed.png" />');
...

FWIW，这将是一个在单击时清除搜索字段的按钮。现在，它正在使用“X”，但这很丑......

我应该注意到我已经尝试了 /app/assets/images/... 的许多排列。

Answer 1

想通了……

资产不仅经过预处理，而且还被丑化并公开安装。我将它复制到 public/assets/images 并能够以 assets/images/DeleteRed.png 的形式访问它。

谢谢...

更新： 这仅在某些情况下有效。在我使用该应用程序时，我发现 URI 发生了变化。尽管存在一些问题，但绝对 URI 始终有效：

http://myprefix.mydomain.com/assets/images/DeleteRed.png

例如，当 myprefix 或 mydomain 更改时，这将失败，例如当我将其推送到生产环境时。最好测试系统变量，构建测试、开发、生产等路径。

Answer 2

如果您的 javascript 文件以 .js.erb 扩展名存储在 app/assets/javascripts 中，您可以像在 HTML 视图中一样插入 Ruby 代码：

$('input[type=search]').each(function () {
  // ...
  $('.theSearch')
    .append('<img id="clrImg" class="clrSearch" src="<%= image_path('DeleteRed.png') %>" />');
  // ...
});

js文件会被asset pipeline自动预处理，image_path Rails helper会保证路径总是正确的（如果你的图片存放在app/assets/images，那就是——不用动发给public！）。