This is messing with my head, this is the code:
$(document).ready(function(){
$(".tour-popover").popover({html: true });
$('#1-popover').popover('show');
$('.next-popover').click(function(){
cur_num = parseInt($(this).attr('id'), 10);
$('#'cur_num+'-popover').popover('destroy');
});
});
The first time I use the popover()
method to show it, it works fine, but if I want to destroy or hide it, it doesn't work and throws this error: Uncaught TypeError: Object [object Object] has no method 'popover'
This is how the files are called:
<link rel="stylesheet" href="files/bootstrap/css/bootstrap.css"/>
<link rel="stylesheet" href="files/bootstrap/css/bootstrap-responsive.css"/>
<link rel="stylesheet" href="files/custom-colors.css"/>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
<link rel="stylesheet" href="files/main.css"/>
<script type="text/javascript" src="files/main.js"></script>
<script type="text/javascript" src="files/bootstrap/js/bootstrap.js"></script>
<script type="text/javascript" src="files/bootstrap/file-upload/bootstrap-fileupload.min.js"></script>
main.js
) before you load bootstrap. You have to load bootstrap before you use it.$(".tour-popover")
... Have the other elements that you work with (like$('#1-popover')
) been initialized?