Question

请问通过javascript为bootstrap tooltip / popover传递选项的正确方法是什么：通过数据属性的工作方式如下：

<input type="text" data-toggle="tooltip" data-placement="right" data-animation="fade" data-delay="200" data-trigger="focus" data-content="foo">

但是使用javascript不会：

<script>
    jQuery(function ($) {
        $("input").popover()({
            animation:"fade",
            delay: "200",
            trigger:"focus",
            placement: "right"
        });
    });
</script>

什么是正确的语法？

Answer 1

对于tooltip，它应该是：

jQuery(function ($) {
    $("input").tooltip({...});
});

而不是：

jQuery(function ($) {
    $("input").popover({...});
});

更新：对于错误的混淆感到抱歉，it works here但是：

popover()({...});

应该是

popover({...});

<强> HTML：

<input type="text" data-toggle="tooltip" data-placement="right" data-animation="fade" data-delay="200" data-trigger="focus" data-content="foo">

<强> JS：

jQuery(function ($) {
    $("input").popover({
        animation:"fade",
        delay: "200",
        trigger:"focus",
        placement: "right"
    });
});

确保您已正确添加JavaScript和CSS个文件。

Answer 2

显示元素的工具提示。

$('#element').tooltip('show')

隐藏元素的工具提示。

$('#element').tooltip('hide')

切换元素的工具提示。

$('#element').tooltip('toggle')

隐藏并销毁元素的工具提示。

$('#element').tooltip('destroy')

完整参考：Here

通过javascript触发bootstrap工具提示选项

2 个答案: