用ajax調用頁面內容

Question

我有一些代碼工作，所以當你點擊導航時，它會將href文本加載到滑動內容框中。

但是，我想將頁面#content加載到我們使用AJAX所在頁面上的#content。

下面是HTML：

<ul> 
<li><a href="about.php">about</a></li> 
<li><a href="gallery.php">gallery</a></li> 
<li><a href="suppliers.php">suppliers</a></li> 
<li><a href="contact.php">contact</a></li> 
</ul> 

這裏是jQuery的：

var lastData; 
$(function() { 
    $("ul li a").click(function(event) { 
     loadData($(this).attr("href") +' #content'); 
     event.preventDefault(); 
    }); 
}); 

function loadData(data) { 
    if(lastData == data) { 
     $("#content-container").slideUp(); 
    } else { 
     //$('#content').load(toLoad) 
     $('#content').html(data); 
     $("#content-container").slideDown(); 
     $('#close').click(function(){ 
       $('#content-container').slideUp('5000'); 
      }) 
    } 
    lastData = data; 
} 

任何幫助將是巨大的。到目前爲止，我非常接近... jquery不是我最強的技能。

謝謝

Answer 1

var lastData; 
$(function() { 
    $("ul li a").click(function(event) { 
     loadData($(this).attr("href")); 
     event.preventDefault(); 
    }); 
    /* I'm assuming #close is added dynamically */ 
    $('document').on("click", "#close", function(){ 
     $('#content-container').slideUp('5000'); 
    }); 
}); 

function loadData(data) { 
    if(lastData == data) { 
     $("#content-container").slideUp(); 
    } else { 
     $('#content').load(data); 
     $("#content-container").slideDown();    
    } 
    lastData = data; 
}