javascript - 使用 data-html 和 box2dweb 的 Bootstrap 工具提示

标签 javascript html css bootstrap-4

我有一个奇怪的错误。如果我将 box2dweb 添加到我的 javascripts 列表中。我的引导工具提示将不再接受 HTML。我有这段代码:

<!DOCTYPE html>
<html>
	<head lang="en">
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
		<title>Test</title>
		  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"></script>
	</head>
	<body>

		<div class="container-fluid">
			<button class="btn-sm btn-primary col" id="btn-test" data-toggle="tooltip" data-placement="bottom" data-html="true" title="<font size='30'>Tooltip</font> <u>with</u> <b>HTML</b>">Test</button>
		</div>
		
		<!-- javascript -->
		<script type="text/javascript" src="js/external/jquery-3.3.1.min.js"></script>
		<script type="text/javascript" src="js/external/bootstrap.bundle.min.js"></script>
		<script type="text/javascript" src="js/external/box2d.min.js"></script>
		
		<script type="text/javascript">
			$(function () {
			  $('[data-toggle="tooltip"]').tooltip()
			})
		</script>

	</body>
</html>

它不会将工具提示中的 HTML 呈现为 HTML。但是,如果我删除嵌入 box2dweb 的脚本行,它将起作用。

有办法解决这个问题吗?

Box2DWeb:Github

最佳答案

确保包含

<script type="text/javascript" src="js/external/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="js/external/bootstrap.bundle.min.js"></script>
<script type="text/javascript" src="js/external/box2d.min.js"></script>

<head>标签

<script type="text/javascript">
            $(function () {
              $('[data-toggle="tooltip"]').tooltip()
            })
</script>

外面<body>标签。

关于javascript - 使用 data-html 和 box2dweb 的 Bootstrap 工具提示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54631467/

相关文章:

javascript - 谷歌地图 LatLng 不是数字

javascript - 使用客户端路由进行 Node 身份验证

javascript - 适用于 Facebook 可玩广告的 SDK

html - Firefox 文本对齐中心不适用于等宽字体

css - 范围 slider 端点在 Firefox 中被切断

css - Zurb Foundation 5 'silent' 占位符类?

Javascript 时间戳到相对时间

JavaScript:应该按顺序执行函数,但实际上并没有这样做?

javascript - 添加一个 onClick 事件到 append()

javascript - 菜单调整大小代码的问题