使用带有 Jade 和 Bootstrap 的下拉菜单给了我 $(".dropdown-toggle").dropdown 不是一个函数答案

【问题标题】：Using Dropdowns with Jade and Bootstrap gives me $(".dropdown-toggle").dropdown is not a function使用带有 Jade 和 Bootstrap 的下拉菜单给了我 $(".dropdown-toggle").dropdown 不是一个函数
【发布时间】：2012-03-26 11:17:04
【问题描述】：

我正在尝试让 Bootstrap 下拉菜单与我的 Jade 布局一起使用。但实际上，当我尝试在我的 Jade-File 中执行 $(".dropdown-toggle").dropdown 时，我遇到了这个错误：

$ is undefined 
$(".dropdown-toggle").dropdown is not a function

为什么我会收到此错误消息？

layout.jade

!!! 5
html
  head
    title= title
    link(rel='stylesheet', href='/lib/bootstrap/css/bootstrap.min.css')

        script(src='lib/bootstrap/js/bootstrap.min.js')
        script(src='lib/jquery/jquery-1.7.1.min.js')

        meta(name='viewport', content='width=device-width', initial-scale='1.0')

    body!= body

index.jade

  div.navbar.navbar-fixed-top
  div.navbar-inner
    div.container
      a(data-toggle='collapse',data-target='.nav-collapse').btn.btn-navbar
      a(href='#').brand #{title}
      div.nav-collapse
        ul.nav
          li.active
            a(href='#') Home
          li
            a(href='#') Blog
          li
            a(href='#') Contact
          li(id='menu1').dropdown
            a(data-toggle='dropdown', href='#menu1').dropdown-toogle Dropdown
              b.caret
            ul.dropdown-menu
              li
                a(href='#') Test
              li
                a(href='#') Test2

script
  $('.dropdown-toggle').dropdown()

【问题讨论】：

标签： jquery node.js twitter-bootstrap pug express

【解决方案1】：

你需要在 bootstrap 之前加载 jQuery 核心 -

script(src='lib/jquery/jquery-1.7.1.min.js')    
script(src='lib/bootstrap/js/bootstrap.min.js')

【讨论】：

我想补充一点，您必须拥有与您的项目相关联的正确 Bootsrap 文件。有一个与 formbalidation.io 一起使用的引导文件，这个文件与 Bootsrap 提供的开箱即用的文件不同。