У меня есть mootools и Twitter Bootstrap (который использует JQuery для своих возможностей Javascript), работающие почти «хорошо» с использованием JQuery.NoConflict () внутри bootstrap-dropdown.js.
Что ж, теперь я пытаюсь использовать bootstrap-popover.js, и он работает не так гладко, как bootstrap-dropdown.js. Ну, я думаю, что это проблема режима совместимости, которую я не очень хорошо понимаю.
У меня есть этот JavaScript с ошибкой:
<script type="text/javascript">
$(function () {
$('td[rel=popover]')
.popover({
offset: 10,
live: true
})
.click(function(e) {
e.preventDefault()
})
})
</script>
И ошибка:
Uncaught TypeError: Property '$' of object [object DOMWindow] is not a function
EDIT:
Я успешно использовал popover и раньше (но не с mootools) и пытался повторить тот же способ и коды. Как раз перед этим кодом JavaScript с ошибкой, я связываю файлы как это (которые успешно загружаются):
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script src="../js/html5.js"></script>
<script src="../js/bootstrap-dropdown.js"></script>
<script src="../js/bootstrap-alerts.js"></script>
<script src="../js/bootstrap-twipsy.js"></script>
<script src="../js/bootstrap-popover.js"></script>
<script src="../js/bootstrap-modal.js"></script>
<link rel="stylesheet" type="text/css" href="../css/bootstrap.css" />
Я знаю, что это должно быть лучше между <head></head>, но оно должно работать и внутри <body> И оно работает для других bootstrap-alerts.js и dropdown.
Кроме того, я вызываю поповер таким образом в <table>:
<thead>
<tr>
<th>Título</th>
<th>Data</th>
<th>Horário</th>
<th rel="popover" data-original-title="A title" data-content="And here's some amazing content. It's very engaging. right?">Ticket Associado <img src="../img/alert-icon.gif"></th>
<th>Entrar no Chat</th>
</tr>
</thead>
И mootools вызывается после twitter-Bootstrap / JQuery.
Любая помощь? Заранее большое спасибо!