Bootstrap 3 弹出框

【问题标题】：Bootstrap 3 popoverBootstrap 3 弹出框
【发布时间】：2014-03-12 10:00:40
【问题描述】：

我有一个显示图像的弹出框：我的html：

 %a#btn2{"data-content" => "#{ image_tag CarConfiguration.last.image_url.to_s}".html_safe ,"data-placement" => "bottom"} Click to toggle popover

我的js：

$('#btn2').popover trigger: "hover", html: true

我想将此片段导出到我的 js： "data-content" => "#{ image_tag CarConfiguration.last.image_url.to_s}"

我该怎么做？

【问题讨论】：

标签： javascript jquery ruby-on-rails twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

可以在定义popover的js函数中设置内容。

应该是这样的：

var myPopoverContent = "#{ image_tag CarConfiguration.last.image_url.to_s}".html_safe;

$('#btn2').popover({
   trigger: 'hover',
   html: true,
   content: myPopoverContent

});

http://jsfiddle.net/afolkesson/s9L9A/

【讨论】：

感谢您的帮助。但是这段代码不能正常工作。问题在于： var myPopoverContent = "#{ image_tag CarConfiguration.last.image_url.to_s}".html_safe;它不会加载这张照片。我不知道如何在 javascript 中评估 ruby 代码。
我不熟悉 ruby-on-rails 但如果您可以将其作为数据内容标签返回，那么您可以添加隐藏输入并将值设置为 url。像这样： %a#hiddenInput{"value" => "#{ image_tag CarConfiguration.last.image_url.to_s}".html_safe} 然后你可以像这样在 js 代码中检索值： var myPopoverContent = $("#hiddenInput" ).val()