2013-03-13 119 views
0

如何在不同的div中顯示內容格式的外部.html文件。例如,如果id爲'li'= 1,則顯示在'id = content1'中。如果id = 2,則顯示在'id = content2'中。現在一切都在從外部.html文件顯示ID = '內容'顯示不同div的內容

這是我的js

var hash = window.location.hash.substr(1); 
var href = $('#nav li a').each(function(){ 
    var href = $(this).attr('href'); 
    if(hash==href.substr(0,href.length-5)){ 
     var toLoad = hash+'.html #content'; 
     $('#content').load(toLoad) 
    }           
}); 

$('#nav li a').click(function(){ 

    var toLoad = $(this).attr('href')+' #content_from_external'; 
    $('#content').slideUp('normal',loadContent).delay(200); 
    window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5); 
    function loadContent() { 
     $('#content').load(toLoad,showNewContent) 
    } 
    function showNewContent() { 
     $('#content').slideDown(1000); 

    } 
    return false; 

}); 

這是我的HTML

<ul id="nav" class="products"> 
         <li id="1"> 
          <a href="products/1.php"><img src="1.jpg"/></a> 
         </li> 
         <li class="under" id="2"> 
         <a href="products/2.php"><img src="2.jpg"/></a> 
         </li> 
         <li id="3">        
         <a href="products/3.php"><img src="3.jpg"/></a> 
         </li> 

         </li> 
    </ul> 
+0

歡迎SO。請接受和/或向上提供您認爲有用的所有答案。 – isherwood 2013-03-13 16:59:46

回答

0
$('#nav li a').click(function(){ 
    var toLoad = $(this).attr('href')+' #content_from_external'; 
    var divId = '#content' + $(this).parents('li').attr('id'); 

    $(divId).slideUp('normal',loadContent).delay(200); 
    ... 
+0

它適合我。非常感謝你 – BahaS 2013-03-13 16:49:43

+0

不客氣。請接受答案。 – isherwood 2013-03-13 16:59:18