Question

我正在使用ajax导航构建一个网站，因此每次用户想要查看另一个页面时，整个网站都不需要加载。家庭，关于，新闻，联系等...

我确实构建了它，url刷新，后退按钮，一切正常但我有以下问题。

Compartilhar /刷新：
当我刷新页面或与某人分享链接时，网站无法正常加载。它只加载该站点的特定部分。示例：如果我共享链接mysite.com/about.php，它将仅加载该页面的文本，而不包含主布局中的页眉，页脚和其他公共元素。也没有css。
如果我在其他页面中刷新页面，也会发生同样的事情。

我尝试按照tutorial here进行操作，但它并没有加载任何内容。请给我一个空白。

我在下面的代码正在运行，但是我已经解决了上述问题。

Jquery代码：

$(document).ready(function() {
    var content = $('#site'),
        firstLink = $(".navbar li:first-child a").attr("href"),
        navLink = $(".navbar li a");

    content.load(firstLink); //default load

    navLink.on("click", function(event){
        event.preventDefault();
        event.stopImmediatePropagation();
        var newLink = $(this).attr("href");

         History.pushState(null, newLink, newLink);

        $(".active").removeClass("active");
        $(this).addClass("active");
        content.load(newLink, function () {
            FB.XFBML.parse();
        });

    });

    History.Adapter.bind(window, "statechange", function() {
        $(".active").removeClass("active");
        $("a[href='" + History.getState().title + "']").addClass("active");
        content.load(document.location.href); 
    });
});

网站结构代码：

<head>
    <script type="text/javascript" src="js/jquery.js"></script>
    <link rel="stylesheet" type="text/css" href="css/main.css" />
</head>
<body>
    <header>
        <!-- more code in here -->
    </header>
    <nav class="navbar">
        <div class="container">
            <ul>
                <li><a class="active" href="/content/home.php">Home</a></li>
                <li><a href="/content/services.php">Services</a></li>
                <li><a href="/content/people.php">People</a></li>
                <li><a href="/content/about.php">About us</a></li>
                <li><a href="/content/news.php">News</a></li>
                <li><a href="/content/contact.php">Contact</a></li>
            </ul>
        </div>
    </nav>
    <div id="site"></div>
    <footer>
        <!-- more code in here -->
    </footer>
    <script type="text/javascript" src="js/history.js"></script>
    <script type="text/javascript" src="js/scripts.js"></script>
</body>

Answer 1

Cookie方式：

创建会话过期cookie。
当有人请求某个网页并拥有时，此Cookie只会发送该部分网页。

但

如果有人请求某个网页并且没有此Cookie。设置会话cookie并发送所有索引页面+额外内容。

示例：

1。我请求services.php，请求Cookie X 。服务器将只发送services.php

2. 我请求services.php和没有cookie X 。服务器将发送index.php，在index.php中你可以创建和包含services.php，如：

//some html
if (!$_COOKIE["some_cookie_name"]) {
    include_once("the_page.php");
}
//more html

3. 如果我请求/，服务器将只发送index.php

如果你从URL的参数中做一个包含，那么请注意他们可以输入什么以及你用它做什么。

javascript（jQuery）方式：

第1步。检查PHP是否是正常的GET或AJAX GET（http://davidwalsh.name/detect-ajax）。你可以通过多种方式实现这一目标。
- 如果呼叫是AJAX。服务于页面的一部分。
- 如果通话不是AJAX。服务于index.php
第2步。在index.php中包含一个javascript，用于检查URL的内容，然后检查特定div的内容，如...：
- 如果网址为services.php且div #yourdiv的内容为空 - >＆gt;对services.php执行ajax调用。
- 如果网址为/或div #yourdiv的内容不为空 - >＆gt;什么都不做。

javascript（jQuery）+ Cookie方式：

第1步。检查PHP是否是正常的GET或AJAX GET（http://davidwalsh.name/detect-ajax）。你可以通过多种方式实现这一目标。
- 如果呼叫是AJAX。服务于页面的一部分。
- 如果通话不是AJAX。提供index.php并将一些cookie名称设置为您想要的页面（例如：services.php）。
第2步。在index.php中包含一个javascript，用于检查您之前创建（或不存在）的Cookie是否存在...：
- 如果存在cookie - ＆gt;在cookie值＆amp;中对URL进行ajax调用。删除cookie。
- 如果cookie不存在 - ＆gt;什么都不做。

希望有所帮助

刷新/共享链接时，WebSite Ajax导航无效

1 个答案: