為什么我的引導工具提示不起作用？
[英]Why are my bootstrap tooltips not working?
問題描述
希望我在Bootstrap中使用一個插件，但我始終會對其進行測試。 這就是為什么我的html如此簡單的原因。 如果您能用我的工具提示幫助我，那將是很棒的。
附：我真的是編碼網站的新手
HTML：
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap-Basis-Vorlage</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Tooltip links">Tooltip links</button>
<script>
$(function () {
$('[data-toggle="tooltip"]').tooltip()
})
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
3 個解決方案
解決方案1
6 已采納 2015-11-16 15:30:32
試試這個代碼
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap-Basis-Vorlage</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Tooltip links">Tooltip links</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script>
$(function () {
$('[data-toggle="tooltip"]').tooltip();
});
</script>
</body>
</html>
解決方案2
4 2015-11-16 15:27:36
解決引導工具提示問題的第一個嘗試是更改選擇器
$(document).ready(function() {
$("body").tooltip({ selector: '[data-toggle=tooltip]' });
});
工具提示也可能有效，但沒有放在div的前面
.tooltip({ container: 'body' })
解決方案3
0 2015-11-16 15:32:31
為什么我的引導工具提示不起作用？
因為您在嘗試通過jQuery初始化工具提示的代碼之后初始化了jquery和bootstrap腳本。 交換他們。 首先是腳本，然后是您的自定義代碼。
Bootstrap工具提示-根本不起作用
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.