Question

我在尝试了一些后成功实现了Bootstrap popover ...

现在我想在popover中实现另一个HTML。像<p align=center>some text</p>这样的普通标签正在工作，但如果我添加一些引号，它就不再起作用了：

<a href="link" rel="popover" data-content="<img src="pathToSource/img.png">" data-placement="top">...</a>

然后我尝试了这个：

<a href="link" rel="popover" data-content="<img src=\"pathToSource/img.png\">" data-placement="top">...</a>

我还尝试用<?PHP echo '...' ?>替换data-content-attribute的内容，但这也不起作用。

有人可以帮我吗？

修改：实际代码

<a href="myFacebookPage" rel="popover" data-content='<div style="width: 100px; height: 200px;" class="fb-like" data-href="myFacebookPage" data-layout="box_count" data-action="like" data-show-faces="true" data-share="true"></div>' data-placement="top" target="_blank">
    <img src="theUsedIcon"
</a>

Answer 1

在弹出窗口的options中，您会注意到它声明使用html选项设置为true，因为如果为false，将使用jQuery的文本方法将内容插入到DOM。它还警告默认值为false，如果您担心XSS攻击，则应使用文本。

因此，请尝试以这种方式编写链接：

<a href="myFacebookPage" rel="popover" data-content='<div style="width: 100px; height: 200px;" class="fb-like" data-href="myFacebookPage" data-layout="box_count" data-action="like" data-show-faces="true" data-share="true"></div>' data-placement="top" target="_blank" data-html="true">
    <img src="theUsedIcon">
</a>

Answer 2

好的，谢谢你的回答：）

我用iFrame Like-Button替换了javascript Like-Button，现在它正在运行。

带有<div> </div>的Bootstrap popover和带有“”的内容

2 个答案: