jQuery将html文件加载到<div>

Question

我想知道我怎么可以用一个HTML文件，并用它来取代内部的空间

我知道你可以用jQuery做，但由于某种原因，它不工作了我。 我有：

$(document).ready(function() {    
    $('#nav li a').click(function(){  
        var toLoad = $(this).attr('href');  
        $('#main').hide('fast',loadContent);   
        function loadContent() {  
            $('#main').load(toLoad);  
        }  
        return false; 
    });  
});  

因此，每当我单击导航栏中的链接时，都应编辑#main div并调出相应的html文件来替换div。 由于某种原因，它只是空白。

Answer 1

检查这条线

 $('#main').hide('fast',loadContent); 

它隐藏了您正在加载内容的div。 如果再次显示该div，则可以在div上看到内容。 所以

 Change 

 $('#main').load(toLoad);

 to 

 $('#main').load(toLoad).show();

Answer 2

你可以试试这个

$(document).ready(function(){ 
    $('#nav li a').click(function(e){  
        e.preventDefault();
        var toLoad = $(this).attr('href');
        $('#main').hide('fast', function(){  
            $('#main').load(toLoad, function(){
                $('#main').show('fast');
            });  
        });
    });
});

$('#main').hide('fast',loadContent); 正在隐藏div因此需要再次显示它，所以我使用了$('#main').show('fast'); 在加载的回调函数中。