Question

我想将我的页面分为两部分。说div 1和div 2。我想在点击页面链接时首先加载div。当div 1中的内容完全加载后，我想开始加载div 2中的内容。

任何可能在所有主流浏览器中都能正常使用的解决方案。

我还希望这些divs中的内容来自同一目录中的其他html。下面是我试图做的事情的代码。

$(document).ready(function(){ 
    $('#div1').load('home/index.html', function() {
        $("#div2").load('home/index2.html');
    });
});

我希望当'home / index.html'中的内容在div1中完全加载时，'home / index2.html'中的内容开始在div2中加载。

下面的代码显示了div中的内容，但我希望在我的第一个div完全加载后开始在第二个div中加载。

$(document).ready(function(){ 
    $('#div1').load('home/index.html');
    $("#div2").load('home/index2.html');
});

Answer 1

您可以使用此javascript：

$(document).ready(function(){ 

    $('#div1').load('home/index.html',function(responseTxt,statusTxt) {
        if(statusTxt == 'success')
        {
            $('#div1').html(responseTxt);
            $('#div2').load('home/index2.html');
        }    

    });
    });

Answer 2

.load()的回调函数用于表示已执行加载而非 加载已完成

参考：http://api.jquery.com/load/

如果提供“完整”回调，则在之后执行已经执行了后处理和HTML插入。回调是为jQuery集合中的每个元素触发一次，然后设置依次为每个DOM元素。

从其他html文件中逐个加载div中的内容

2 个答案: