javascript - Bootstrap 确认图标未显示

Question

我为我的链接创建了 Bootstrap 确认:

<a data-toggle="confirmation" data-title="Delete work order[![enter image description here][1]][1]?"
    href="##"><img src="./img/delete.png" height="15" ></a>

还有 JS:

$('[data-toggle=confirmation]').confirmation({
});

一切正常，但删除和取消图标未显示(下图)。为什么现在才显示？有没有办法删除这个图标并只显示带有标签的按钮？

谢谢

Answer 1

首先确保您的页面中包含以下所有 3 个文件。 特别是包含字体的 css 文件。

 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

图像未显示，因为您引用了图像所在实际目录的完整链接。

这样的事情可以给你一个线索

http://localhost/project/img/delete.png

或者您也可以尝试添加两个点 (..) 来加深检索。

../img/delete.png

同时 bootstraps 有许多漂亮的 gliphyicons，您可以在不使用图像的情况下集成它们

您可以使用 Bootstrap 字形尝试此目录

<a data-toggle="confirmation" data-title="Delete work order[![enter image description here][1]][1]?"
    href="##">Delete <span class="glyphicon glyphicon-remove"></span></a>

有关 Boostraph Gliphyicons 的更多引用可以在这里找到 https://www.w3schools.com/bootstrap/bootstrap_ref_comp_glyphs.asp