Javascript 您能为bootstrap v4中的Popover提供一个可用的JSFIDLE吗？或者告诉我'；这个怎么了？

您能为BootstrapV4中的弹出窗口提供一个工作的JSFIDLE吗？或者告诉我这个有什么问题吗？我在bootstrap v3中发现了这个工作的JSFIDLE：

我创建了一个新的JSFIDLE，并将v3 js/css引用更新为v4，并添加了控制台请求的附加js库：

---

控制台不返回任何错误，但JSFIDLE不工作。知道它有什么问题吗？

引导程序4与引导程序3的结构不同。如果从popover规则中删除

display:none

，则单击时会显示它们，您还应将

popover

类添加到模板最外层的div中

见：

最外层的包装器元素应该具有

.popover

类

你将不得不重写你的CSS关于popover的箭头。只需检查元素即可查看更改

最小示例：

$（函数（）{
$（'[data toggle=“popover”]'）。popover（）；
})

.example-class1{
背景色：#2a4254；
高度：77px；
宽度：77px；
颜色：白色；
光标：指针；
浮动：对；
}
.popover.popover{
宽度：250px；
填充：0px 1px 1px；
文本对齐：左对齐；
空白：正常；
背景色：#2a4254！重要；
-webkit背景剪辑：填充框；
背景剪辑：填充框；
边框：1px实心#ccc；
边框：1px实心rgba（0,0,0,2）；
边界半径：0px！重要；
-webkit盒阴影：0 5px 10px rgba（0,0,0,2）；
盒影：0 5px 10px rgba（0,0,0,2）；
颜色：白色；
}
.popover.popover 1.bs栓带元件连接在右侧：：之后，
.popover.popover 1.popover左：：后{
左边框颜色：#2a4254；
}

测试1

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

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