Django에서 자바 스크립트 드롭 다운이 작동하는 데 문제가 있습니다.

아주 간단한 Django 웹 앱을 작성하여 URL에 뷰를 연결 한 다음 뷰 템플릿을 렌더링합니다. 내 애플 리케이션의 프런트 엔드를 더 유용하게 만들기 위해 내 템플릿에 트위터 부트 스트랩을 사용하고 싶습니다. Twitter Bootstrap의 CSS가 정상적으로 작동하는 것 같지만 자바 스크립트에 문제가 있습니다. 내 템플릿 디렉토리라는 dropdown.html에서 테스트 페이지를 설정하고 다음과 같은 포함 : 여기 Django에서 자바 스크립트 드롭 다운이 작동하는 데 문제가 있습니다.

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <title>Simple test of JavaScript dropdown menus in Twitter Bootstrap</title> 

    <!-- Le styles --> 
    <link href="{{ STATIC_URL }}bootstrap/css/bootstrap.css" rel="stylesheet"> 
    <style type="text/css"> 
     body { 
     padding-top: 60px; 
     padding-bottom: 40px; 
     } 
    </style> 

    <script src="{{ STATIC_URL }}bootstrap/js/bootstrap.js"></script> 
    </head> 

    <body> 

    <div class="navbar navbar-inverse navbar-fixed-top"> 
     <div class="navbar-inner"> 
     <div class="container"> 
      <a class="brand" href="#">Dropdown test</a> 
      <div class="nav-collapse collapse"> 
      <ul class="nav"> 
       <li class="dropdown"> 
       <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a> 
       <ul class="dropdown-menu"> 
        <li><a href="#">Action</a></li> 
        <li><a href="#">Another action</a></li> 
       </ul> 
       </li> 
      </ul> 
      </div><!--/.nav-collapse --> 
     </div> 
     </div> 
    </div> 

    </body> 
</html>

가 결과 페이지의 스크린 샷입니다 :

enter image description here

나는 알고 Django에서 로그 출력을 볼 수 있기 때문에 다음과 같은 CSS 및 JavaScript 파일이 브라우저로 전달됩니다.

[06/Nov/2012 18:14:30] "GET /dropdown/ HTTP/1.1" 200 1465 
[06/Nov/2012 18:14:30] "GET /static/bootstrap/js/bootstrap.js HTTP/1.1" 200 56478 
[06/Nov/2012 18:14:30] "GET /static/bootstrap/css/bootstrap.css HTTP/1.1" 200 121663

파이어 폭스에서 페이지를로드하고 Firebug를 사용하여 "소스보기"포함 된 자바 스크립트 (bootstrap.js의 2025 행 모두)를 볼 수 있으며, 드롭 다운 코드는 내가 원하는 곳 (라인 571)에서 볼 수 있습니다.

그러나 불행히도 드롭 다운 메뉴를 클릭해도 아무런 변화가 없습니다.

출처

2012-11-06 jononomo

JQuery를 포함 시키면 작업이 시작됩니다. 위의 예에서 <head>은 다음과 같아야합니다.

<head> 
    <meta charset="utf-8"> 
    <title>Simple test of JavaScript dropdown menus in Twitter Bootstrap</title> 

    <!-- Le styles --> 
    <link href="{{ STATIC_URL }}bootstrap/css/bootstrap.css" rel="stylesheet"> 
    <style type="text/css"> 
     body { 
     padding-top: 60px; 
     padding-bottom: 40px; 
     } 
    </style> 

    <script src="{{ STATIC_URL }}jquery/jquery-1.8.2.js"></script> 
    <script src="{{ STATIC_URL }}bootstrap/js/bootstrap.js"></script> 
    </head>

출처

2012-11-07 00:47:35 jononomo

Django에서 자바 스크립트 드롭 다운이 작동하는 데 문제가 있습니다.

답변

관련 문제