Question

我正在尝试将多个HTML外部页面导入一个div。示例：我是page1.HTML，page2.html等等。我有这个JQuery：

<script type="text/javascript">
$(document).ready(function() {
$('.main').load('page1.html');
});
</script>

这项工作正常，但我不确定如何添加多个页面以在页面加载时导入同一个div。

感谢我的朋友。

Answer 1

如果你想要倍数，那么你就无法使用负载。请改用$.get并指定回调以将其添加到div：

var pages = ['page1.html', 'page2.html', etc..],
    $main = $('.main'),
    doLoad = function () {
        if(pages.length > 0) {
          // use shift to get the next page off the array
          $.get(pages.shift(), function(content) {
              // append content to .main
              $main.append(content);
              // call do load to get the next entry
              doLoad();
          });
        }
    };

doLoad();

Answer 2

var pages=["page1.html","page2.html","page3.html"],
    mainDiv=$(".main");
$.each(pages, function(i,page){
    var newDiv=mainDiv.append("div");
    newDiv.load(page);
});

如果您只想加载页面片段（如果您处理包含头标记的完整页面通常就是这种情况），那么

load（）将比get（）更容易。

Answer 3

创建要加载的HTML文件数组，并使用每个页面的ajax调用遍历数组，然后使用jQuery prepend（）将内容放入元素中。

在页面加载时将多个HTML页面导入单个div

3 个答案: