通过AJAX将PHP文件加载到DIV中

假设我有一个

index.php

，它将

page.php

加载到类“

wrapper

”的

div

”中

php

page.php

又有自己的链接，我希望它能够在您单击其中一个链接时，将相应的页面加载到相同的“

包装器”
div

同样，加载的页面可能有自己的链接，我想继续将内容加载到同一个div中。如何实现页面的这种连锁效应？

$('#link').click(function() {
        var go = $.ajax({
            type: 'POST',
            data: {m: 'ajax', // POST Variables go here...
                linkID: $(this).val()} // $(this).val() is the value of the link clicked
        })
        .done(function(results) {
            $('#resultsDiv').html(results); // This is where your results go
        })
        .fail(function(msg) {
            alert("Error:" + msg);
        })
        .always(function() {
        });
    }

我将把AJAX调用放入一个函数中：

function loadWrapper($url){
    $('#wrapper').load($url+' > *',function(){
        $(this).on('click','a',function(e){
            e.preventDefault();
            loadWrapper($(this).attr('href'));
        });
    });
}

然后在页面加载时，将单击指定给页面上最初加载的任何项目：

$('.LinkClass').on('click',function(e){
    e.preventDefault();
    loadWrapper($(this).attr('href'));
});

当然，还有您的原始负载：

loadWrapper('page.php');

函数中的回调将允许在加载的链接上触发click事件，以及将来要在
.Wrapper
中加载的任何其他链接。只要给那些链接class
LinkClass
（或者你想要的任何东西），你就可以开始了。
使用jQuery：

var activateLinks = function() {
    $('.wrapper a[href]').click(function(){
        $('.wrapper').load($(this).attr('href'), activateLinks);
        return false;
    });
}

$('.wrapper').load('page.php', activateLinks);

否则

$('.wrapper').on('click', 'a[href]', function() {
    $('.wrapper').load($(this).attr('href');
    return false;
}
$('.wrapper').load('page.php');

使用委托是最好的方式，这样您就不必为新页面上的链接运行处理程序附件。它们是自动处理的

$(document).on('click', 'div.wrapper a[href]', 'click', function (e) {
    e.preventDefault();
    $.get($(this).attr('href'), function (html) {
       $('div.wrapper').html(html);
    });
});

您是使用vanilla JS还是像jQuery这样的库来加载AJAX？将
page.php
放在
中我使用jQuery……出于安全原因，我不想使用iframe。我需要查看更多代码来给您一个真实的副本/过去的答案，但这是您可以用来检测单击了哪个按钮，加载了哪些内容，以及将结果放在何处。最好在此处使用委托，否则每次加载新内容时都需要运行委托<代码>$（文档）。在（'click'，'div.wrapper a[href]'上，函数（e）{/*您的链接处理*/}）

是否在现有的

$（文档）中包含loadWrapper函数调用。准备好了吗？为了避免混淆，我去掉了包装器，只需将
loadWrapper
调用放入现有的
ready
函数。编辑：我刚刚注意到你在别人的回答上遇到了同样的问题。您过去是否成功加载了
page.php
？它是否在没有AJAX的情况下加载到浏览器中？因为页面本身可能会被破坏。是的，我包括了loadWrapper。此外，page.php本身也可以在浏览器中工作。
page.php
与页面
index.php
位于同一文件夹中？或者它在子文件夹中？是的。它在同一个文件夹中。我简单地尝试了：$（document）.ready（function（）{$（“#wrapper”）.load（“page.php”）；}）；但是它仍然没有显示page.php。。。。。