Question

我有将代码加载到Div中的代码。但是如何让它在初始加载时加载内部页面。因此，当网站首次加载时，它不仅仅是一个空白页面。但是“pages / index.php”将加载到内容区域（apDiv2）中，而不是空白页面。

$('.menu_nav').click(function() {
    var href = $(this).attr('href');

       // I Assume that /loading.gif is the url to your gif file
    $('#apDiv2').empty().append($('<img src="img/loader1.GIF" />'));

    $.ajax({
        method: 'GET',
        url: href,
        success: function(content)
        {
            $('#apDiv2').html (content);
        }
    });

    return false;
});

Answer 1

您可以使用在页面加载结束时触发的jQuery.ready()事件。

$( document ).ready(function() {
    //Page is loaded.
});

Answer 2

您可以将HTML放在＃apDiv2中，初始页面加载时会显示其中的任何内容。

您还必须删除empty()（如果要显示某些内容，则不想清空html）并向loader1.gif添加一些css样式，以便它覆盖在您的内容之上

Answer 3

不要过度使用ajax，只在需要时才使用它！在这个特定的情况下，它不需要，并且说实话，使用它比使用普通的服务器端脚本更糟糕（使用ajax需要一个请求，这将使总页面加载更长）。
我建议只使用php包含该文件：

 <div id="#apDiv2"><?php include 'pages/index.php'; ?></div>

这会将index.php代码放入div中，并且在加载页面时它将存在，而不使用任何ajax。

Answer 4

如果您要求初始加载。

$( document ).ready(function() {
     $.ajax({
    method: 'GET',
    url: "pages/index.php",
    success: function(content)
    {
        $('#apDiv2').html (content);
    }
});
    });

AJAX：如何在初始加载时加载内部网页？

4 个答案: