使用Bootstrap'；Javascript字符串中的popover插件

我试图让popover插件在Javascript字符串中工作。因此，当用户鼠标移动到地理位置时，弹出框将出现，当鼠标被移走时，弹出框将消失

<script type="text/javascript">
     $('#directions-panel').text("We can't give you directions to our office as you don't have", <a href="#" rel="popover" data-content="Some content..." data-original-title="Some title..." > geolocation </a> " enabled on your browser. Enable geolocation and try again. The map above will show you where our office is located.");
</script>

我知道这里到处都是，但我到处找了找，找不到任何和我想做的事情相似的东西。我相信这是可以做到的，有人给我指出正确的方向吗

编辑：

我知道联系人页面中有以下内容：

<div id="directions-panel">
        <div id="directions-error-message" style="visibility:hidden">
          We can't give you directions to our office as you don't have <a href="#" id="geoloc-popover" rel="popover" data-content="Some content..." data-original-title="Some title..." > geolocation </a> enabled on your browser. Enable geolocation and try again. The map above will show you where our office is located.
        </div>
</div>

---

有没有办法只在

方向错误消息中进行“地理定位”

DIV触发popover？

为什么不试试这样的方法呢：

<div style="visibility:hidden">
  We can't give you directions to our office as you don't have", <a href="#" rel="popover" data-content="Some content..." data-original-title="Some title..." > geolocation </a> " enabled on your browser. Enable geolocation and try again. The map above will show you where our office is located.
</div>

我们无法为您提供到我们办公室的方向，因为您的浏览器上未启用“，”。启用地理定位，然后重试。上面的地图会告诉你我们办公室的位置。

然后使用javascript更改div的可见性。通过这种方式，jQuery设置标题将识别链接，但用户在需要时才会看到链接。

确实有一个选项，可以启用其数据api来触发切换弹出框。启用它将使所有带有适当标记的动态添加元素都可以工作，而无需在JavaScript中进行进一步的初始化调用

默认情况下禁用该功能主要是因为订阅页面上的所有mouseenter和mouseleave事件可能会导致性能问题（这是TBS<2.1中的默认设置）。如果您可以保持激活区域相对特定，那么您应该具有良好的性能

要仅为悬停时的

#方向面板

启用它，语法如下：

$('#directions-panel').popover({selector: '[rel="popover"]', trigger: 'hover'});

---

所有后续的面板更新（包括popover）都将在默认情况下处于活动状态。

感谢这似乎是一个更好的解决方案，可以解决我尝试的问题，但我希望popover能够打开鼠标，就像@merv在下面建议的那样。

popover

的默认操作是悬停，所以我不确定你的意思。从您的问题听起来，您在激活popover时遇到了问题，因为在绘制页面时HTML元素不存在。也许我读错了，但你能澄清问题是什么吗？@Jaambageek v2.1中的默认选项不再是

悬停

，而是

单击

。谢谢，我刚刚注意到了这一点并修改了我的答案。我实际上只有一件事需要一个popover，因此性能不应该是问题，但感谢你指出了任何方式。我只希望保存地理位置的锚标记（如原始问题所示）触发popover。是否可以转到

$（“#方向错误消息a”）.popover…

？如果在添加锚点后调用它，这将起作用，但选择数据api的全部目的是使ajaxy不需要后续调用。如果您知道只将其应用于锚定标记，则可以使用：

$（“#方向面板”）.popover（{selector:'a[rel=“popover”]”）

。popover对象必须附加到页面上的持久性对象。

选择器

值是指定元素的值。只要您不添加

rel=“pover”

在其他锚点上，它们将被忽略。您现在所要做的就是将

$（“#方向错误消息”）

更改为

$（“#geoloc popover”）

。您正在使用ID#方向错误消息（而不仅仅是链接）将popover触发器设置为整个div。似乎仍然不起作用。我将触发器放在

失败

中，但仍然没有区别。我想按ID选择锚点？这不是类似于

$（'a[ID=“\geoloc popover]”的东西吗

？您不希望触发器位于failure函数中。任何标记的id都可以用

#其值

引用，因此您不需要

a[id=“#geoloc popover”]

。请尝试从popover函数中删除选择器行。它应该是

$（function（）{$（'geoloc popover'）。pover（{trigger:'hover}）}）

。实际上，实现popover功能的最佳方法是使用您最初使用的代码，只需添加

触发器：'hover'

选项。这种方法更通用，适用于您想要使用的任何popover，按名称调用它只会影响您示例中的特定链接。我想我终于找到了我找到了答案。我在chrome中检查了调试器，发现一个未捕获的引用错误：$未定义。我的JQuery文件放在html文档的底部（正如Bootstrap建议的那样），因此在加载JQuery之前调用了ready函数。我刚刚将JQuery文件移到了标题，它现在正在工作，感谢您的帮助！

<div style="visibility:hidden">
  We can't give you directions to our office as you don't have", <a href="#" rel="popover" data-content="Some content..." data-original-title="Some title..." > geolocation </a> " enabled on your browser. Enable geolocation and try again. The map above will show you where our office is located.
</div>

$('#directions-panel').popover({selector: '[rel="popover"]', trigger: 'hover'});