0

このデモをクリックしてcontent（index.php？id = id）クリックしてsubject（index.php）に戻ります。

Q1。（index.php？id = id）直接リンクcontentページは利用できません。（index.php）と表示されますsubject。なぜですか？

Q2。2回目（進む>戻る>進む>戻る）の後に戻るをクリックすると、URLの変更が停止します。なぜですか？（Safari 5）更新：window.onpopstateURLの使用は正常に機能します。このエラーは発生しません。


任意の提案をいただければ幸いです。

$(window).bind('popstate', function(){
    $.ajax({
        url:location.pathname,
        success: function(data){
            $('.container').html(data);
        }
    });
});

デモ

$('.subject').click(function(){
    $.ajax({
        url: 'index.php?id=' + $(this).attr('rel'),
            success: function(data){
                $('.container').html(data);
            }
    });
    var pageurl;
    pageurl = 'index.php?id=' + $(this).attr('rel');
    if(pageurl != window.location){
        window.history.pushState({path: pageurl}, "", pageurl);
    }
    return false;
});

index.php

<div class="container">
    <?php
        if($_GET['id']){
           ...
            print"<div class="content"></div>";
        }
        else{
           ...
           print"<div class="subject" rel="id"></div>"
        }
    ?>
</div>
4

2 に答える 2

1

popstate イベント ハンドラーは、 pushState に渡した状態を含むイベントオブジェクトを受け取ります。Here's the event interface definition経由でアクセスできます。概念を説明するためのデモ コードを次に示します。event.state

window.addEventListener("popstate", function(event) {
if( event.state !== null )    
    alert('Browser back button was clicked, state returned ' + JSON.stringify( event.state ) ); 
};
于 2012-12-13T22:21:57.363 に答える
1

ajax を使用してページ コンテンツ (つまり、シナリオの対象) を取得し、ページ コンテナーに表示するだけです。「index.php」にいて、件名をクリックすると、URL が「index.php?id=7」に変わります。ここで、「popstate」イベントで、「location.pathname」から「http://host/index.php」が返されます。以上で、ajax を使用して「location.pathname」からデータを取得し、表示します。

$(window).bind('popstate', function(){
    $.ajax({
        url:location.pathname,
        success: function(data){
            $('.content').html(data);
        }
    });
});
于 2012-12-14T08:39:06.067 に答える