twitter bootstrap dropdown not working in django t

2019-08-12 08:14发布

Thanks for trying to help in advance!

My problem is that twitter bootstrap's dropdown menu (for navbar) doesn't work for me and I am very lost now. My header code (so yes, I do include their .js and call it):

<head>
  <title>{% block title %}User test{% endblock %}</title>
  <!--for IE6-8 support of HTML elements -->
  <!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
  <![endif]-->

  <script type="text/javascript" src="http://twitter.github.com/bootstrap/assets/js/bootstrap-dropdown.js"></script><!--dropdown addon-->
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script><!--jquery-->
  <script type="text/javascript">
        $(document).ready(function(){
        $('.dropdown-toggle').dropdown();
    });
   </script>

   <link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}style.css" /><!--link to my style.css-->
   <link rel="stylesheet" type="text/css" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" /><!--link to bootstrap's css-->

The menu item that is suppose to have dropdown:

     <ul class="nav">
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                        {% trans "Logged in" %}: {{ user.username }} 
                        <b class="caret"></b>
                    </a>
                    <ul class="dropdown-menu">
                        <li><a href="{% url auth_password_change %}">{% trans "Change password" %}</a></li>
                        <li><a href="{% url auth_logout %}">{% trans "Log out" %}</a></li>
                    </ul>
                </li>
                <li><a href="/upload/">{{ "Upload your CVS" }}</a></li>
                <li><a href="/settings/">{% trans "Settings" %}</a></li>
      </ul>

Thanks again,

blargie-bla

3条回答
祖国的老花朵
2楼-- · 2019-08-12 08:37

As John Said I indeed needed to change the lines. For some magical reason (still don't know why!) it was breaking at the breakpoints that weren't even set and hence jquery wasn't loading. After rebooting the browser, it worked.

查看更多
甜甜的少女心
3楼-- · 2019-08-12 08:48

Switch the order of your js includes so jQuery is loaded first.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script><!--jquery-->
<script type="text/javascript" src="http://twitter.github.com/bootstrap/assets/js/bootstrap-dropdown.js"></script><!--dropdown addon-->
查看更多
老娘就宠你
4楼-- · 2019-08-12 08:56

you must use the last version of jquery (1.7)

查看更多
登录 后发表回答