新手问题 slim bootstrap 下的 dropdown 菜单

brucebot · 2012年12月04日 · 最后由 brucebot 回复于 2012年12月05日 · 4482 次阅读

各位, 作为第一批 rabel 的付费用户,感谢@daqing的开源,其他人也能用这个 forum,也让我慢慢熟悉不懂的 rails。 现在碰到一个问题,rabel 的 layout 是使用 slim 的,我试了几个下拉菜单的方法,都不见有效果,比如这个,我直接在某个 view 里面使用,也不能显示下拉菜单。

.topbar-wrapper{:style => "z-index: 5;"}
  .topbar{"data-dropdown" => "dropdown"}
    .topbar-inner
      .container
        %h3
          = link_to 'Project', root_path
        %ul.nav
          %li
            = link_to 'Home', '#', {:class => 'active'}
          %li
            = link_to 'Link', '#'
          %li
            = link_to 'Link', '#'
          %li
            = link_to 'Link', '#'
          %li
            = link_to 'Apps', applications_path
          %ul{:class => "nav secondary-nav"}
            %li.dropdown
              = link_to 'Dropdown', '#', {:class => 'dropdown-toggle'}
              %ul.dropdown-menu
                %li
                  = link_to 'Secondary Link', '#'
                %li
                  = link_to 'Something else here', '#'
                %li.divider
                %li
                  = link_to 'Another link', '#'
        %form.pull-left{:action => ""}
          %input{:placeholder => "Search"}
        %ul{:class => "nav secondary-nav"}
          %li.dropdown
            = link_to 'Dropdown', '#', {:class => 'dropdown-toggle'}
            %ul.dropdown-menu
              %li
                = link_to 'Secondary link', '#'
              %li
                = link_to 'Something else here', '#'
              %li.divider
              %li
                = link_to 'Another link', '#'

以下是我的 layout 里面的菜单,我想把 ul.dropdown 以下的内容写成下拉菜单,不太明白产生问题的原因,请指教。

body#rabel
    .navbar.navbar-inverse.navbar-static-top
      .navbar-inner
        .container
          a.btn.btn-navbar.collapsed(
           data-toggle='collapse'
           data-target='.nav-collapse')
           span.icon-bar
           span.icon-bar
           span.icon-bar
          = link_to Siteconf.site_name, root_path, class: :brand
          .nav-collapse.collapse
            form.navbar-search.pull-right
              input#q.search-query type='text' name='q' maxlength=40 data-domain=Settings.canonical_host placeholder=t(:search)
            ul.nav.pull-left
              = nav_item(t('site.a'), a_path)
              = nav_item(t('site.b'), b_path)
              = nav_item(t('site.c'), c_path)
              ul.dropdown-menu
              - if user_signed_in?
                li= nav_item current_user.nickname, member_path(url_encode(current_user.nickname))
                li= nav_item t('site.d'), d_path
                - if current_user.e?
                  li= nav_item t('site.e'),e_path
                li= link_to t('site.f'), f_path, :method => :delete
              - else
                = nav_item(t('site.g'), g_path)
                = nav_item(t('site.h'), h_path)

PS:在改的网站是 http://roboticsfaq.com

Dropdown menu 是 Bootstrap 的 js 库驱动的 http://twitter.github.com/bootstrap/javascript.html#dropdowns

确保已经载入了 bootstarp 的 JS 库 以及 follow 上面连接的格式

#1 楼 @kevinzhow 加载是 bootstrap/dropdown.js 的方式的,不过很奇怪我重新放入了 dropdown.js/dropdown.css,重新 complie 了 asset,还是出不来

需要 登录 后方可回复, 如果你还没有账号请 注册新账号