引导选项卡 - 单击“后退”按钮时更改选项卡

Question

我正在使用类似于 google+ 选项卡的 bootstrap3 选项卡来实现：

https://plus.google.com/109537483127696013335

与 google+ 类似，每次用户单击新选项卡时，我也会使用 history.pushState() 更改 URL。

问题：

假设您查看了这 3 个选项卡：

https://plus.google.com/109537483127696013335/posts
https://plus.google.com/109537483127696013335/about
https://plus.google.com/109537483127696013335/photos

您的浏览器历史记录中有 3 项，如果您单击后退按钮，您将返回到 /about，然后返回 /posts，但页面内容将保持不变（/照片）而不是改回正确的选项卡。

这个问题存在于 google+ 中，我想要更好的后退按钮行为以获得更好的用户体验，我该如何解决它？

Answer 1

        <script type="text/javascript">
            $(document).ready(function(){
                /*For browser back button press*/
                if (window.history && window.history.pushState) {
                    $(window).on('popstate', function(e) {
                        var url      = window.location.href;     
                        var origin   = window.location.origin;
                        var pathname = window.location.pathname;
                        var url = window.location.href;
                        var avoid = origin+pathname;
                        var abc=url.replace(avoid, '');
                        $('[href="' + abc + '"]').click();
                    }); 
                }
                /*End for browser back button press*/
            });
        </script>