2017-02-10 12 views
0

最後にjbarコードのdrefファイルにdjangoのURLを使用していますが、動作しませんが、URLを削除して '#' jqueryが正常に動作します。 これはdjangoのURL(おそらく)と関係があると思います。 とにかく、私はこの問題を解決したいのですが、なぜこれが起こっているのか、この問題を解決する方法を教えてください。以下は基本テンプレートとurl.py ですが、各URLは別々のhtmlファイルを指しています。例えば、 。 /ホーム/ポイントがあなたに "/" を追加する必要がありますdjangoテンプレート、urls、jqueryに関する問題が発生しました

base.html

<html> 
<head> 
    {% load staticfiles %} 
    <meta charset="UTF-8"> 

    <title>{% block title %}{% endblock %} | Vasu Genset Pvt. Ltd.</title> 

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 

    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 

    <link rel="stylesheet" href="https://bootswatch.com/paper/bootstrap.min.css"> 

    <link rel="stylesheet" type="text/css" href="{% static 'index/css/index.css' %}"> 

    <link rel="stylesheet" href="{% static 'index/css/products-style.css' %}"> 

    {% block style %}{% endblock %} 


</head> 
<body> 

    <nav class="navbar navbar-default"> 
     <div class="container"> 
      <div class="navbar-header"> 
       <a class="navbar-brand" href="#" >Vasu Genset Pvt. Ltd.</a> 
       <button class="navbar-toggle collapsed" data-toggle="collapse" data-target="#mydropdown"> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
       </button> 
      </div> 
      <div id="fh5co-navbar" class="collapse navbar-collapse" id="mydropdown"> 
       <ul class="nav navbar-nav navbar-right" id="navbar-change"> 
        <li><a class="active" href="#">Home</a></li> 
        <li><a href="#">About Us</a></li> 
        <li class="dropdown"> 
        <a href="/productsandservices/" class="dropdown-toggle" data-toggle="dropdown">Products & Services <span class="caret"></span></a> 
         <ul class="dropdown-menu"> 
          <li><a href="/generatorrepair/">Generator Repair</a></li> 
          <li><a href="/generatormaintenance/">Generator Maintenance</a></li> 
          <li><a href="/alternator/">Alternator Repair & Maintenance</a></li> 
          <li><a href="/amc/">AMC Service Provider</a></li> 
          <li><a href="/spareparts/">Spare Parts</a></li> 
          <li><a href="/generatorrentalhire/">Generator Rental & Hire</a></li> 
          <li><a href="/synchronizing/">Synchronizing Panel</a></li> 
          <li><a href="/amfpanel/">AMF Panel</a></li> 
          <li><a href="acousticenclosures">Acoustic Enclosures</a></li> 
         </ul> 
        </li> 
        <li><a href="/contactus/">Contact Us</a></li> 
       </ul> 
      </div> 
     </div> 
    </nav> 


    {% block body %} 
    {% endblock %} 

    <footer class="text-center"> 
      <div class="container-fluid"> 
       <div class="row"> 
        <div class="col-xs-offset-1 col-xs-10 col-md-offset-3 col-md-6"> 
         <h4>Copyright &copy; Vasu Genset Pvt. Ltd.</h4> 
        </div> 
       </div> 
      </div> 
    </footer> 

</body> 

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
    <!-- Include all compiled plugins (below), or include individual files as needed --> 
    <script src="{% static 'index/js/bootstrap.min.js' %}"></script> 

    <script> 
     $('.nav li').click(function(e) { 
      console.log(e.currentTarget,"//",e.target,"//",this); 
      e.stopPropagation(); 
      $('.nav li').removeClass('active'); 
      $(this).addClass('active'); 
     }); 
    </script> 


</html> 

urls.py

from django.conf.urls import url 
from . import views 

urlpatterns = { 
    url(r'^$', views.home, name='home'), 
    url(r'^home/', views.home, name='home'), 
    url(r'^aboutus/', views.about, name='aboutus'), 
    url(r'^productsandservices/', views.product, name='product'), 
    url(r'^contactus/', views.contact, name='contactus'), 
    url(r'^generatorrepair', views.generatorrepair, name='generatorrepair'), 
    url(r'^generatormaintenance', views.generatormaintenance, name='generatormaintenance'), 
    url(r'^alternator', views.alternator, name='alternator'), 
    url(r'^amc', views.amc, name='amc'), 
    url(r'^spareparts', views.spare, name='spareparts'), 
    url(r'^generatorrentalhire', views.rentalhire, name='rentalhire'), 
    url(r'^synchronizing', views.synchronizing, name='synchronizing'), 
    url(r'^amfpanel', views.amf, name='amfpanel'), 
    url(r'^acousticenclosures', views.acoustic, name='acoustic'), 
} 

答えて

0

about.htmlする/弊社について/ポイントをhome.htmlします残りのあなたのURL(私はあなたがすでに最初の4つのものだけを持っているのを見ています)。 Djangoはそれらにアクセスすることができますこの方法:

url(r'^generatorrepair/', views.generatorrepair, name='generatorrepair'), 
    url(r'^generatormaintenance/', views.generatormaintenance, name='generatormaintenance'), 
    url(r'^alternator/', views.alternator, name='alternator'), 
    url(r'^amc/', views.amc, name='amc'), 
    url(r'^spareparts/', views.spare, name='spareparts'), 
    url(r'^generatorrentalhire/', views.rentalhire, name='rentalhire'), 
    url(r'^synchronizing/', views.synchronizing, name='synchronizing'), 
    url(r'^amfpanel/', views.amf, name='amfpanel'), 
    url(r'^acousticenclosures/', views.acoustic, name='acoustic'), 

が要素に「アクティブ」クラスを追加するための作業のスクリプトを取得するには、代わりに「LI」の「」要素を選択して、前のfind()関数を使用します。このように:

$('.nav a').on('click', function(e){ 
    console.log(e.currentTarget,"//",e.target,"//",this); 
    e.stopPropagation(); 
    $('.nav').find('.active').removeClass('active'); 
    $(this).parent().addClass('active'); 
}); 
+0

まだjqueryは機能していません –

+0

私は私の答えを編集しました。お役に立てれば! –

関連する問題