рельсы + HTML: как показать изображение на моей странице

Question

Привет, У меня есть следующий html внутри одного из моих файлов javascript.

function addToInfoWindow(infoWindowContent) 
{ 
    infoWindowString = '<div id="infoWindowString">'+ 
    '<img src="assets/images/rails.png">'+ 
    '<h2>You Clicked:</h2>'+ 
    '<p>'+infoWindowContent+'</p>'+ 
    '<p><a href="http://www.google.com">See more info</a></p>'+ 
    '<p><a href="http://www.cnn.com">see news</a></p>'+ 
    '</div>'; 
    infoWindow.setContent(infoWindowString); 
} 

Проблема заключается в том, что я не могу заставить изображение отображаться в информационном окне.

Я понимаю, что это может быть потому, что рельсы имеют какую-то вспомогательную функцию для отображения изображений на своих веб-страницах. Но я не смог найти, как назвать это или что это такое. Может кто-то помочь, пожалуйста.

Edit- изменен на следующий после следующей реакции:

function addToInfoWindow(infoWindowContent) 
{ 
    infoWindowString = '<div class="infoWindowString">'+ 
    '<img src="/Users/AM/Documents/RailsWS/cmdLineWS/Businesses/app/assets/images/rails.png">'+ 
    '<h2>You Clicked:</h2>'+ 
    '<p>'+infoWindowContent+'</p>'+ 
    '<p><a href="http://www.google.ca">See Menus</a></p>'+ 
    '<p><a href="http://www.google.ca">Upload a Menu</a></p>'+ 
    '</div>'; 
    infoWindow.setContent(infoWindowString); 
} 

Но изображение еще не отображается :(

Answer 1

Если вы используете настройку по умолчанию с упаковкой активов rails, она добавит временную метку к именам файлов активов, что означает, что просмотр только /assets/images/foo.jpg не обязательно даст вам то, что вы хотите.

Помощник рельсов, чтобы получить изображение, является только image_tag 'example.jpg'. ИЛИ, если вы просто хотите URL-адрес, image_url 'foo.jpg'.

Для любого изображения, которое вы хотите хранить вы можете прикрепить его к атрибуту данных, например, в виде вы можете сделать:

<a id="image_link" href="#" data-image-url="<%= image_url 'foo.jpg' %>">Click to see image</a> 

Вы можете получить этот путь в любом месте в JQuery, используя

var imageUrl = $('a#image_link').data('image-url') 

Answer 2

Вы используете относительный URL для изображения (assets/images/rails.png), так что браузер будет попробуйте загрузить его из адреса относительно текущей страницы. Например, если изображение на

http://example.com/assets/images/rails.png 

но вы в настоящее время

http://example.com/something/somepage.html 

браузер попытается загрузить его из

http://example.com/something/assets/images/rails.png 

и потерпит неудачу.

Вы должны использовать абсолютный URL-адрес.