클래스를 추가하여 탭을 전환하고 탐색 막대에 자바 스크립트가있는 템플릿을로드하는 방법은 무엇입니까?

Question

나는 cordoda android 프로젝트에서 작업하며 탭이있는 navbar을 만들고 싶습니다. 탭을 클릭하면 내용이 $("").load('');으로로드되고 active 클래스를 추가해야합니다. 완벽 오류가 추가 온 클릭 기능 switchSimulasi()이

을

작동하지 않습니다되어

추가 '활성'수준의 작품이 내 HTML 코드입니다 :

<nav class="navbar navbar-default navbar-fixed-top a-navbar box-shadow" id="a-navbar-default" style="z-index:997;"> 
    <div class="container"> 
     <div class="navbar-header col-lg-12 col-md-12 col-sm-12 col-xs-12"> 
      <a class="navbar-brand" href="#"> 
       <span class="a-navbar-logo" onclick="openNav()"> 
        &#9776; Easly 
       </span> 
      </a> 
     </div> 
     <div class="navbar-header"> 
      <ul class="nav navbar-nav" id="a-navbar-nav"> 
       <li class="active active-box-shadow"><a href="#">Beranda</a></li> 
       <li onclick="switchSimulasi();"><a href="#">Simulasi Pinjaman</a></li> 
      </ul> 
     </div> 
    </div> 
</nav> 

그리고 난이 자바 스크립트 코드로 시도 :

<script type="text/javascript"> 
    $(".nav li").on("click", function() { 
     $(".nav li").removeClass("active"); 
     $(".nav li").removeClass("active-box-shadow"); 
     $(this).addClass("active"); 
     $(this).addClass("active-box-shadow"); 
    }); 

    function switchSimulasi{ 
     $("#mainContent").load('template-simulasi-pinjaman.html'); 
    } 
</script> 

Answer 1

여기

구문 오류 :해야 function switchSimulasi() { $("#mainContent").load('template-simulasi-pinjaman.html'); }

Answer 2

를 사용하여 jQuery를에값, 당신은해야 - $(this)[0], 그래서 :

$(".nav li").on("click", function() { 
    $(".nav li").removeClass("active"); 
    $(".nav li").removeClass("active-box-shadow"); 
    $(this)[0].addClass("active"); 
    $(this)[0].addClass("active-box-shadow"); 
});  

그러나이 경우

, IMO 더 나은 그냥 일반 JS는 :