簡體   English   中英

PJAX和Firefox后退按鈕問題

[英]PJAX and Firefox back button issue

我正在測試jquery.pjax.js,發現一個問題。
在我的最小測試項目中,發生如下奇怪的行為:

  1. 在fireflx中訪問index.php
  2. 單擊pjax鏈接:位置欄和頁面內容已更改
  3. 單擊Firefox的后退按鈕:位置欄已更改,但內容保留

這種行為在GoogleChrome中不會發生。
我想知道如何解決這個問題。

我的測試項目是:
http://karasunouta.com/php_test/pjax/
http://karasunouta.com/files/pjax.zip

index.php

<?php
    $page = 1;
    if (isset($_GET['page'])) {
        $page = $_GET['page'];
    }

    $isPjax = false;
    if (!empty($_SERVER['HTTP_X_PJAX'])) {
        $isPjax = true;
    }

    if (!$isPjax):
?>
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title>page<?php echo $page; ?></title>
            <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
            <script type="text/javascript" src="js/jquery.pjax.js"></script>
            <script type="text/javascript">
                $(function(){
                    // link
                    $(document).pjax('a.pjax', '#main');

                    // form
                    $(document).on('submit', 'form', function(event) {
                        $.pjax.submit(event, '#main')
                    })
                });
            </script>
        </head>
        <body>
            <h1>pjax test</h1>
            <ul class="links">
                <li><a href="?page=1" class="pjax">page1</a></li>
                <li><a href="?page=2" class="pjax">page2</a></li>
                <li><a href="?page=3" class="pjax">page3</a></li>
            </ul>
            <form>
                Page:<input name="page" type="text" value="1">
                <input type="submit">
            </form>
            <div id="main" style="border: 3px double gray">
<?php endif; ?>
                <?php include("page/{$page}.html") ?>
<?php if (!$isPjax): ?>
            </div>
        </body>
    </html>
<?php endif; ?>

page / 1.html

page1 contents

page / 2.html

page2 contents

page / 3.html

page3 contents

js / jquery-1.9.1.min.js
js / jquery.pjax.js

我本來可以找到解決方案的...

之前:

$(function(){
    // apply pjax
});

后:

$(document).ready(function() {
    // apply pjax
});

現在,Firefox后退按鈕看起來工作正常。
我不確定原因。
他們的實際行為看起來有所不同,盡管有幾篇文章說這兩種寫作形式的含義是完全相同的...

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM