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所以需要再次显示它，所以我在load的回调函数中使用了这个$('#main').show('fast');。

jQuery将html文件加载到<div> </div>中

2 个答案: