Bootstrap Popover-JS触发器

Question

我试图用JS触发Bootstrap的弹出。

我希望能够相对于单击的链接更改消息和标题。

如果我实际单击该链接，则可以使用它，但是我想通过Jquery .Click事件来实现。

这是我当前的JS代码：//全局工具提示功能

$(function () {
    $(".tool-tip").on("click",function () {
        //Initializes Tooltip
        $(function () {
            $("#ToolTipContainer").popover();
        });
        var title = $(this).attr("data-tooltip-title"),
            message = $(this).attr("data-tooltip-message");
        $("#ToolTipContainer").attr("title", title);
        $("#ToolTipContainer").attr("data-content", message);
        $("#ToolTipContainer").click();
    });
});

这是我从以下位置调用函数的DOM元素：

<button type="button" class="tool-tip btn btn-default" data-dismiss="modal" data-tooltip-title="Item Added" data-tooltip-message="Some Message">Continue Shopping</button>

这是弹出容器（css​​隐藏了此容器，我只想看到弹出窗口）：

<a href="#" id="ToolTipContainer" data-toggle="popover" data-trigger="focus" data-placement="bottom" title="" data-content=""></a>

引导程序文档： 引导程序PopOver

Answer 1

您可以通过调用以编程方式显示工具提示

.popover（ '节目'）

$(function () {
    $(".tool-tip").on("click",function () {
        //Initializes Tooltip
        $(function () {
            $("#ToolTipContainer").popover();
        });
        var title = $(this).attr("data-tooltip-title"),
            message = $(this).attr("data-tooltip-message");
        $("#ToolTipContainer").attr("title", title);
        $("#ToolTipContainer").attr("data-content", message);
        $("#ToolTipContainer").popover('show');
    });
});

尽量不要隐藏popover容器，这很可能是隐藏您的popover。