最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - $("a[rel=popover]").popover is not a function - Stack Overflow

programmeradmin2浏览0评论

I call the js files for bootstrap twitter library but I get the error that indicates

$("a[rel=popover]").popover is not a function

.

<script src="../../jq/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="../../bootstrap/js/bootstrap.js" type="text/javascript"></script>
<script src="../../bootstrap/js/bootstrap-tooltip.js" type="text/javascript"></script>
<script src="../../bootstrap/js/bootstrap-popover.js" type="text/javascript"></script>

<script type="text/javascript">
    $(document).ready(function () {

        // second supervisor popover
        $('a[rel=popover]').popover({
            placement: 'below',
            offset: 20,
            trigger: 'manual'
        });
    });


</script>

I call the js files for bootstrap twitter library but I get the error that indicates

$("a[rel=popover]").popover is not a function

.

<script src="../../jq/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="../../bootstrap/js/bootstrap.js" type="text/javascript"></script>
<script src="../../bootstrap/js/bootstrap-tooltip.js" type="text/javascript"></script>
<script src="../../bootstrap/js/bootstrap-popover.js" type="text/javascript"></script>

<script type="text/javascript">
    $(document).ready(function () {

        // second supervisor popover
        $('a[rel=popover]').popover({
            placement: 'below',
            offset: 20,
            trigger: 'manual'
        });
    });


</script>
Share Improve this question asked Apr 23, 2012 at 9:59 AdhamAdham 64.9k98 gold badges232 silver badges348 bronze badges 3
  • Looks like the popover library hasnt loaded correctly, you sure the url is correct? – Richard Dalton Commented Apr 23, 2012 at 10:03
  • @Bader remove all the loose bootstrap plugin scripts and just keep the bootstrap.js script intact, that script file es with all of the plugins already included inside. – Andres I Perez Commented Apr 23, 2012 at 10:33
  • @Bader can you post a link to your site? I'm sure that some assets might be missing. – Andres I Perez Commented Apr 23, 2012 at 12:28
Add a ment  | 

2 Answers 2

Reset to default 2

This happened to me in ASP.NET MVC 4. In my project I had a

@Scripts.Render("~/bundles/jquery")

both at the top of my page in the <head> and then again one of these little @Scripts.Render("~/bundles/jquery") suckers snuck in towards the end of the page just before the </body>. I removed the redundant line at the end of the page and the problem went away.

Note that the browser rendered the <head> in the correct order:

<script src="/Scripts/jquery-1.9.1.js">
<script src="/twitterBootstrap/js/bootstrap.js">
<script src="/Scripts/modernizr-2.5.3.js">

However, I ended up with another

<script src="/Scripts/jquery-1.9.1.js">

at the bottom of the page. This confused the browser and it confused the heck outta me too.

This works:

http://jsfiddle/9W53Q/7/

Edit: http://jsfiddle/9W53Q/272/

Make sure the resoures are being added in the right order (tooltip first). Or like Richard Dalton suggested (and I remend), just use the piled bootstrap.js file.

$(document).ready(function() {
    $('a[rel=popover]').popover();
});
发布评论

评论列表(0)

  1. 暂无评论