2015-05-03 2 views
1

Я играю с Bootstrap и тестирую всплывающие подсказки, но они, похоже, не работают. Я получил следующий простой код:Bootstrap tooltip не работает

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head> 
    <title>Tooltip</title> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> 
    <script> 
     $(function() { 
      $('[data-toggle="tooltip"]').tooltip() 
     }) 
    </script> 
</head> 
<body> 
    <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</button> 

    <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="top" title="Tooltip on top">Tooltip on top</button> 

    <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</button> 

    <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="right" title="Tooltip on right">Tooltip on right</button> 
</body> 
</html> 

который выглядит следующим образом: http://i.gyazo.com/a1d844593410ac2c7c13546182317579.png

Может кто-то пожалуйста, указать на мою ошибку?

ответ

2

Для загрузки Bootstrap требуется загружать jQuery. Из official documentation:

JQuery требуется Пожалуйста, обратите внимание, что все плагины JavaScript требуют Jquery быть включены, как показано в шаблоне стартера. Обратитесь к нашему bower.json, чтобы узнать, какие версии jQuery поддерживаются.

Вы должны увидеть ошибки в консоли браузера говорят вам:

JavaScript Bootstrap требует JQuery

Добавьте эту строку перед файлом Bootstrap Javascript:

<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script> 
+0

Спасибо за ответ! Это сработало, но я должен был добавить '' по какой-то причине? – user4803090

+0

@DavidG У вас неверная ссылка. Похоже, вы смутили jQuery с пользовательским интерфейсом jQuery. – cvrebert