Bootstrap popover插件无法正常工作

Question

我在点击<span>元素时尝试使用Twitter Bootstrap popover plugin来显示弹出窗口。

页面上包含所有文件，包括bootstrap-tooltip.js和bootstrap-popover.js。这是我调用popover的jQuery代码：

$('#supported-hosts').popover({
    'animation': true,
    'html': 'test',
    'trigger': 'click'
});

然而，当我点击元素时没有任何反应。开发人员控制台中没有任何Javascript错误。

我也试过这样做没有效果：

$('#supported-hosts').on('click', function() {
    $(this).popover('show');
});

我对于什么是错误一无所知，因为据我所知，Bootstrap文档中我正确使用它。

编辑：HTML也只是一个span元素：

<span id="supported-hosts">Supported filehosts</span>

Answer 1

为了显示弹出窗口，您需要指明其内容应该是什么。

您可以在html标记本身上执行此操作：

<span id="supported-hosts" data-content="Popover content">Supported filehosts</span>

或使用JavaScript：

$('#supported-hosts').popover({
    'content': 'Popover content'
    'animation': true,
    'html': 'test',
    'trigger': 'click'
});

默认情况下，弹出窗口将使用触发它的元素的title属性，因此您也可以根据需要使用该属性。