不要再次加載當前內容

Question

我在我的主頁中加載外部內容。一切工作正常。但我有一個問題。如果我點擊當前鏈接，內容也將被加載。但我希望只有在內容是其他內容時纔會加載內容。

$(document).ready(function() { 
    $(".navigation li").click(function() { 
     var quelle = $(this).attr('id') + ".php"; 
     // content 
     $(".content").fadeOut(function() { 
      $(this).load("content/" + quelle).fadeIn('normal'); 
     }) 

     // advertisement 
     $(".advertisement").fadeOut(function() { 
      $(this).load("advertisement/" + quelle).fadeIn('normal'); 
     }) 

     // header 
     $(".contentHeader").fadeOut(function() { 
      $(this).load("header/" + quelle).fadeIn('normal'); 
     }) 

    }); 
}); 

這裏是HTML。而且是啊...我忘了點擊事件處理程序;）

<div class="container"> 

    <div class="navigation"> 

     <ul> 
      <li id="1"> 
       <div class="menuImage"></div> 
       <div class="menuText"><p>1</p></div> 
      </li> 
      <li id="2"> 
       <div class="menuImage"></div> 
       <div class="menuText"><p>2</p></div> 
      </li> 
      <li id="3"> 
       <div class="menuImage"></div> 
       <div class="menuText"><p>3</p></div> 
      </li> 
      <li id="4"> 
       <div class="menuImage"></div> 
       <div class="menuText"><p>4</p></div> 
      </li> 
      <li id="5"> 
       <div class="menuImage"></div> 
       <div class="menuText"><p>5</p></div> 
      </li> 
      <li id="6"> 
       <div class="menuImage"></div> 
       <div class="menuText"><p>6</p></div> 
      </li> 
     </ul> 

    </div> 

    <div class="mainContainer"> 

     <div class="containerHeader"> 

      <div class="contentHeader"> 
       <p>old header</p> 
      </div> 

     </div> 

     <div class="contentContainer"> 

      <div class="content"> 
       <p>old content</p> 
      </div> 

      <div class="advertisement"> 
       <p>old advertisement</p> 
      </div> 


     </div> 

    </div> 

</div> 

Answer 1

您可以保存當前的ID是這樣的：

$(document).ready(function() { 
    var current; 
    $(".navigation li").click(function() { 
     var quelle = $(this).attr('id') + ".php"; 
     if(current === quelle) { 
      return; 
     } 

     current = quelle; 
     // content 
     $(".content").fadeOut(function() { 
      $(this).load("content/" + quelle).fadeIn('normal'); 
     }) 

     // advertisement 
     $(".advertisement").fadeOut(function() { 
      $(this).load("advertisement/" + quelle).fadeIn('normal'); 
     }) 

     // header 
     $(".contentHeader").fadeOut(function() { 
      $(this).load("header/" + quelle).fadeIn('normal'); 
     }) 

    }); 
});