twitter-bootstrap 为什么我的引导工具提示不起作用?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/33738776/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Why are my bootstrap tooltips not working?
提问by Johannes Getzner
Bevor i use a plugin for Bootstrap i always test it before. This is why my html is so simple. It would be great if you could help me out with my tooltips.
Bevor 我使用 Bootstrap 插件我之前总是测试它。这就是为什么我的 html 如此简单。如果你能帮助我解决我的工具提示,那就太好了。
Ps: i am really new to coding Websites
Ps:我对编码网站真的很陌生
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>
回答by Nenad Vracar
Try this code
试试这个代码
<!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>
回答by stackoverfloweth
my first attempt to resolve bootstrap tooltip issues is to change the selector
我解决引导工具提示问题的第一次尝试是更改选择器
$(document).ready(function() {
$("body").tooltip({ selector: '[data-toggle=tooltip]' });
});
it's also possible that the tooltip is working, but isn't placed in front of your div
也有可能是工具提示有效,但没有放在你的 div 前面
.tooltip({ container: 'body' })
回答by turbopipp
Why are my bootstrap tooltips not working?
为什么我的引导工具提示不起作用?
Because you initialize the jquery and bootstrap scripts after the code where you try to initialize the tooltip via jQuery. Swap them around. Scripts first, then your custom code.
因为您在尝试通过 jQuery 初始化工具提示的代码之后初始化 jquery 和引导程序脚本。交换他们。首先是脚本,然后是您的自定义代码。

