html - 在没有 AJAX 的情况下加载页面的一部分

Question

我正在开发一个网站，我希望左侧菜单保持固定，同时加载单击选项的内容。

实际上，我所做的是使用 AJAX 返回请求的内容的每个菜单链接。一切正常，但我想避免使用它，因为这样很难跟踪统计数据(以及其他一些东西，例如 Google boots)。

如何在没有 javascript 的情况下实现相同的影响/类似 (http://www.foundcrelamps.com/)？

Answer 1

我会做的有点不同。我会让菜单上的链接指向内容的有效链接。例如，Contacte 指向 http://www.foundcrelamps.com/contacte，这样如果您将该链接粘贴到浏览器中，它将直接加载页面。

然后保留 ajax，这样用户就不会在每次点击时重新加载整个页面。

您可以使用 History.js保留浏览器历史记录并修改 URL，以便后退/下一步按钮工作，即使使用 ajax。

编辑，如果您使用带有标准 href 的常规 a 元素，它可能看起来像这样:

$('a').click(function(){
    $('YOUR CONTAINER').load($(this).attr('href'));
    return false; // so that it does not load the whole page
});

然后在服务器上你应该做这样的事情:

/* AJAX check  */
$isAjax = false;
if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) && $_SERVER['HTTP_X_REQUESTED_WITH']==='XMLHttpRequest') {
    $isAjax = true;
}

if (!$isAjax) {
    outputHeader();
}

outputMainContent();

if (!$isAjax) {
    outputFooter();
}

这样当你使用 ajax 时，你将只加载内部内容。否则，它将加载整个页面。

还有一种替代方法 - 您可以使用 jQuery 加载整个页面，但只使用 html 的内部部分来替换原始内容。