本文介绍了无法获得基本pjax例如工作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

编辑:(非)在这里工作的例子: http://www.jogos-mmorpg.com/pjax.html

(non) working example here:http://www.jogos-mmorpg.com/pjax.html

我试图重现一个非常基本的PJAX例如像在自述解释(的https:// github上.COM / defunkt / jQuery的-pjax

I'm trying to reproduce a very basic PJAX example like explained in the readme (https://github.com/defunkt/jquery-pjax)

这是index.html的:

This is the index.html:

<!DOCTYPE html>
<html>
    <head>
         <script src="http://pjax.heroku.com/jquery.js"></script>
         <script src="http://pjax.heroku.com/jquery.pjax.js"></script>

        <script type="text/javascript">
            $(document).ready(function(){
                $(document).pjax('a', '#pjax-container')
            });
        </script>

    </head>
    <body>

      <h1>My Site</h1>

      <div class="container" id="pjax-container">
        Go to <a href="./next.html">next page</a>.
      </div>

    </body>
</html>

这是next.html

And this is the next.html

<p>next page</p>

当我点击下一页的链接,我只是去next.html,我在屏幕上看到的仅仅是下页段落,就像我会与pjax完全禁用。

When i click on the "next page" link, i simply go to next.html and the only thing i see on the screen is the "next page" paragraph, just like i would with pjax completely disabled.

我在想什么?

推荐答案

您已经阅读了整个示例页面?因为我会认为你没有,因为你没有在OP提到它。

Have you read the entire example page? Because I will consider that you didn't, as you have not mentioned it in the OP.

据,更具体说以下内容:

It, more specifically, says the following:

魔法!几乎。您仍然需要配置您的服务器,寻找pjax请求和发送回pjax的具体内容。

的pjax Ajax请求发送的X PJAX头所以在这个例子(在大多数情况下),我们想在不与该头的任何请求任何布局返回网页只是内容

The pjax ajax request sends an X-PJAX header so in this example (and in most cases) we want to return just the content of the page without any layout for any requests with that header.

要我看来, pjax 不是那么好用。您需要处理发送 X-PJAX 头。

To me it seems that pjax is not that easy to use. You need to handle the sending of the X-PJAX header.

更新:我已经测试您的网站上(与Firefox控制台)以下code,并且工作:

UPDATE: I have tested the following code on your site (with Firefox console), and it is working:

$(document).ready(function() {
    $("#pjax-container a").pjax(
        {
            container: "#pjax-container",
            timeout: 5000
        }
    );
});

请注意以下事项:

Do note the following things:

  • 我已经重组了code更jQuery的兼容,不知道这是问题。什么是它现在是这样的:
    • 在选择 $(#pjax-容器),它使用了 pjax()功能
    • I have restructured the code to be more jQuery-compliant, not sure if that was the issue. What is does now is the following:
      • On the selector $("#pjax-container a"), it uses the pjax() function.
      • 在它的目标容器#pjax容器作为替代目标。
      • It targets container #pjax-container as the target for replacement.

      另外一个侧面说明:我注意到 pjax 还更新了 window.location.href 到新的URL,自己决定,如果你想要这种行为或不。

      Another side note: I noticed that pjax also updates the window.location.href to the new url, decide for yourself if you want this behaviour or not.

      这篇关于无法获得基本pjax例如工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

10-23 08:35