Bootstrap Popover不起作用

Rodrigo de Farias:

引导弹出窗口未显示我的页面

这是我的HTML:

<button type="button" class="btn btn-lg btn-danger" 
        data-toggle="popover" title="Popover title"
        data-content="And here's some amazing content. It's very engaging. Right?">
     Click to toggle popover
</button>

这是我添加的所有js和CSS文件:

@Styles.Render("~/Content/css")
@Styles.Render("~/Content/bootstrap.min.css")
@Styles.Render("~/Content/bootstrap.css")
@Styles.Render("~/Content/bootstrap-theme.css")
@Styles.Render("~/Content/css/default.css")

@Scripts.Render("~/Scripts/jquery-2.1.1.js")
@Scripts.Render("~/Scripts/jquery.unobtrusive-ajax.js")
@Scripts.Render("~/bundles/modernizr")
@Scripts.Render("~/Scripts/bootstrap.js")

有人可以告诉我问题出在哪里吗?

PS:有没有一种方法可以使弹出窗口正常工作而无需编写任何脚本代码?

KyleMit:

从“ 弹窗文件”中

选择加入功能:
出于性能原因,Tooltip和Popover数据API是选择加入的,这意味着您必须自己对其进行初始化

因此,您必须.popover()像这样在JavaScript中手动调用

$("[data-toggle=popover]").popover();

或者您可以使用任何想要的选择器

这是使用StackSnippets的示例。

$("[data-toggle=popover]").popover();
body {
  padding: 50px;
}
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"/>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>


<button type="button" class="btn btn-lg btn-danger" 
        data-toggle="popover" title="Popover title" 
        data-content="And here's some amazing content. It's very engaging. Right?">
  Click to toggle popover
</button>

注意:这类似于“ 引导工具提示不显示”的答案

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章