2015-11-16 43 views
0

Bevor我使用一個插件引導我總是測試它之前。這就是爲什麼我的html非常簡單。 如果你能用我的工具提示幫助我,那將是非常棒的。爲什麼我的引導工具提示無法正常工作?

PS:我是真正的新的編碼網站

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> 
+0

包括最新的'jquery'版本 –

+0

它工作https://jsfiddle.net/2Lzo9vfc/91/ –

+0

我不明白。這讓我變得非常生氣 –

回答

5

試試這個代碼

<!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> 
4

我的第一個要解決的引導提示問題,嘗試改變選擇

$(document).ready(function() { 
    $("body").tooltip({ selector: '[data-toggle=tooltip]' }); 
}); 

它也有可能是工具提示正在工作,但不會放在您的div前面

.tooltip({ container: 'body' }) 

https://stackoverflow.com/a/31811884/3511012

0

爲什麼我的引導提示不工作?

因爲您在試圖通過jQuery初始化工具提示的代碼之後初始化jquery和bootstrap腳本。將它們交換。先編寫腳本,然後是自定義代碼。

相關問題