Question

我正在使用history.js在使用ajax更改内容时使用pushState更改页面的网址。

我的问题是我转到的初始页面无法使用后退按钮。内容未存储或我用于获取内容的信息未存储。

如果我在初始化时调用pushState，那么我会以某种方式获得该页面的两个条目。因此，当我回击时，我必须再次回到我来自的主页面。不知道这是否有意义。在这里似乎没有找到与我的特定案例相关的任何内容。

$(function() {
    var History = window.History; 
    if ( !History.enabled ) {
        return false;
    }
    if($.url().attr('fragment')){
        var url = $.url().attr('fragment').split("-");
    }else{
        var url = $.url().attr('path').split("-");
    }

    photo_ajax(url[3],url[2],url[4]); //perform ajax content update

    //initialize first page but doesn't quite work as it creates two entries
    //History.pushState({pho_id:url[3],per_id:url[2],a_id:url[4]}, "Viewing Photo", $.url().attr('path')); 

    History.Adapter.bind(window,'statechange',function() {
        var State = History.getState();
        photo_ajax(State.data.pho_id,State.data.per_id,State.data.a_id);
    });
});


$(document).ready(function(){  
    $(document).on('click', '[id^="dopho_"]', function(event){
        var id = $(this).attr("id").split('_');
        event.preventDefault();
        History.pushState({pho_id:id[1],per_id:id[2],a_id:id[3]}, "Viewing Photo", $(this).attr('href'));
    });
});

Answer 1

我发现了一些有用的东西。如果我改为使用replaceState，则初始化行有效，双条目似乎不会发生。所以我现在就这样做。

$(function() {
        var History = window.History; 
        if ( !History.enabled ) {
            return false;
        }
        if($.url().attr('fragment')){
            var url = $.url().attr('fragment').split("-");
        }else{
            var url = $.url().attr('path').split("-");
        }

        photo_ajax(url[3],url[2],url[4]); //perform ajax content update

        //initialize first page but doesn't quite work as it creates two entries
        History.replaceState({pho_id:url[3],per_id:url[2],a_id:url[4]}, "Viewing Photo", $.url().attr('path')); 

        History.Adapter.bind(window,'statechange',function() {
            var State = History.getState();
            photo_ajax(State.data.pho_id,State.data.per_id,State.data.a_id);
        });
    });


    $(document).ready(function(){  
        $(document).on('click', '[id^="dopho_"]', function(event){
            var id = $(this).attr("id").split('_');
            event.preventDefault();
            History.pushState({pho_id:id[1],per_id:id[2],a_id:id[3]}, "Viewing Photo", $(this).attr('href'));
        });
    });

History.JS后退按钮不适用于第一页

1 个答案: