Question

我有secure.php页面，其中包含标题，css等。在安全页面中，我有一个名为dynamic的div，其中加载了其他php页面的内容。

包含内容的网页是page1.php和page2.php。

我简化的安全php代码：

<!DOCTYPE html>
<head>    
    <script src="js/jquery-1.10.0.min.js"></script>
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    <script src="js/modernizr-2.6.2-respond-1.1.0.min.js"></script>
    <script src="js/jquery.ba-hashchange.min.js"></script>
    <script>

    $(document).ready(function() {
        loadPage1();
    });
    $(function() {
  $(window).hashchange( function() {

    if (location.hash == "#page1") {
        loadPage1();
    };
    if (location.hash == "#page2") {
        loadPage2();
    };
  })

  // Since the event is only triggered when the hash changes, we need to trigger
  // the event now, to handle the hash the page may have loaded with.
  $(window).hashchange();

});


    function loadPage1() {
        $('#dynamic').load('page1.php');
    }

    function loadPage2() {
        $('#dynamic').load('page2.php');
    }

</script>

    </head>
    <body class="bodysecure">        
        <div id="headermenu">
            <div class="menuitem"><a href="#page1" onmouseover="" onClick="loadPage1()">Page1</a></div>
            <div class="menuitem"><a href="#page2" onmouseover="" onClick="loadPage2()">Page2</a></div>
        </div>

            <div id="dynamic"></div>

    </body>
</html>

我目前的代码工作正常。也许它可以更好地编程，但这不是问题。

问题是，后退/前进按钮不起作用，您无法为特定页面添加书签，因为该URL始终是secure.php。我去寻找解决方案并看到很多非常复杂的插件（我只是一个初学者）。

没有插件有没有简单的方法可以做到这一点？喜欢使用标签？也许有人可以给我一个例子，也许是小提琴？

Answer 1

您可以执行以下操作：

// Document ready checks if the hash is set in which it loads the correct page.
// on default (if no hash set) page1.php will be the page.
$(document).ready(function() {
    var page = window.location.hash || 'page1.php'; 
    loadPage(page);
});

// This loads the actual page.
function loadPage(page) {
    $('#dynamic').load(page);
    window.location.hash = page;
}

Jquery使用load（）和后退按钮

1 个答案: