JQUERY:没有重新加载,后退和前进的网站在刷新后不起作用

时间:2017-08-13 12:20:14

标签: jquery dynamic back forward

我正在尝试在没有重新加载页面的情况下完成我的投资组合。我有一个我无法解决的问题。

当我点击链接时,会加载下一个链接,但是当我返回第一个链接并刷新页面时。背部和前部不再是动态的。

我该如何解决这个问题?提前谢谢。

这是我的代码:

$(document).ready(function() {
$('a').live('click', function(event){
    //LOAD PAGE ON CLICK
    var link = $(this).attr('href');
    $('#md').fadeOut(200, function(e) {
        $(this).load(link + ' .md', function(e) {
            $(this).fadeIn(200);
        });
    });
    //LOAD PAGE CHANGE HISTORY
    window.history.pushState(null, null, link);
    popstate = function(url){$('#md').load(url + ' #md');}
    window.onpopstate = function(event){popstate(window.location.href);event.preventDefault();}
    return false;
});
});

1 个答案:

答案 0 :(得分:0)

我更正了最近的jquery

的代码

但是我仍然不知道为什么onpopstate在重新加载后不保存历史记录然后后退和前进不再起作用...

$(document).on('click', 'a', function(){
    //LOAD PAGE ON CLICK
    var link = $(this).attr('href');
    $('#md').fadeOut(200, function() {
        $(this).load(link + ' .md', function() {
            $(this).fadeIn(200);
        });
    });
    //SAVE HISTORY
    window.history.pushState({}, null, link + ' ');
    //BACK/FORWARD HISTORY
    popstate = function(url){
        $('#md').fadeOut(200, function() {
            $(this).load(url + ' #md', function() {
                $(this).fadeIn(200);
            });
        });
    }
    //SAVE LINK BACK/FORWARD HISTORY
    window.onpopstate = function(event){
        popstate(window.location.href);
        event.preventDefault();
    }
    //RETURN FALSE
    return false;
});