Javascript / Jquery:后退按钮根本不改变内容

时间:2013-12-24 03:53:56

标签: javascript ajax

<script>
$(function(){
    $("a[rel='tab']").click(function(e){
        e.preventDefault(); 

        pageurl = $(this).attr('href');

        $.ajax({url:pageurl+'&rel=tab',success: function(data){
            $('#right_column').html(data);
        }});

        if(pageurl!=window.location){
            window.history.pushState({path:pageurl},'',pageurl);    
        }
        return false;  
    });
});

/* the below code is to override back button to get the ajax content without reload*/
$(window).bind('popstate', function() {
    $.ajax({url:location.pathname+'&rel=tab',success: function(data){
        $('#right_column').html(data);
    }});
});
</script>

我从演示中删除了这段代码并修改它以适应我的特定项目;但是,我试图运行它,因为它是测试功能。该演示工作完美。唯一的主要区别是他们使用的是jquery 1.4.4,我使用的是jquery 1.9.1。我似乎无法让后退按钮正常工作。击球时网址会发生变化;但是,#right_column根本不会更新。我直接从一个演示中复制了这段代码并调整了div id以匹配我的,它仍然无法正常工作。下面的代码行是可疑的代码。

/* the below code is to override back button to get the ajax content without reload*/
    $(window).bind('popstate', function() {
        $.ajax({url:location.pathname+'&rel=tab',success: function(data){
            $('#right_column').html(data);
        }});
    });

另外,我可以使用location.pathname.replace('index.php', 'view.php')吗?不确定这是否是正确的编写特定代码的方法来替换index.php?variables ... with view.php?variables ...将该页面加载到右列。如果问题的这一部分让您感到困惑,请参阅我的其他帖子...... javascript/jquery: Need to substring in jquery(修改后的代码)

1 个答案:

答案 0 :(得分:0)

对于那些可能有帮助的人来说,这最终修复了我的代码,它现在响应后退按钮。

$(window).on('popstate', function() {
    $.ajax({url:$(location).attr('href').replace('index.php', 'rightcolumn.php') +'&rel=tab',success: function(data){
        $('#right_column').html(data);
    }});
});