我有一个选项卡的内容。基于下面的HTML

I have a tabbed content. based on the HTML below:

<ul class="tabContainer">
</ul>

<div id="tabContent">
     <div id="contentHolder">
        <!-- The AJAX fetched content goes here -->
     </div>
   <div id="pagination"></div>
</div>

f_tab是管理本以​​上的HTML内容，包括以下动作的功能

f_tab is the function that manages the content of this above HTML,including actions below:

分页使用jPaginator插件内容容器内的每个内容（ https://github.com/remylab/ jpaginator ）：

 function f_tab(str){
$(document).ready(function(){

        var Tabs = {
        '1' : 'page1.php?p='+var,
        '2' : 'page2.php?p='+var,
        '3' : 'page3.php?p='+var,

    }


 var topLineColor = {
    blue:'lightblue',
    blue:'lightblue',
    blue:'lightblue',}


$.each(Tabs,function(i,j){

    var tmp = $('<li><a href="" class="tab">'+i+' <span class="left" /><span class="right" /></a></li>');


    tmp.find('a').data('page',j);


    $('ul.tabContainer').append(tmp);
})


var the_tabs = $('.tab');

the_tabs.click(function(e){

    var element = $(this);


    if(!element.data('cache'))
    {   

        $.get(element.data('page'),function(msg){
            $('#contentHolder').html(msg);
            element.data('cache',msg);
        });
    }
    else {
    $('#contentHolder').html(element.data('cache'));

    }
    e.preventDefault();

})

the_tabs.eq(2).click();    });       return false;        }

分页功能（只为信息）是：

The pagination function (just for information) is:

 (function($){

    $.fn.extend({ 
        MyPagination: function(options) {
            var defaults = {
                height: 600,
                fadeSpeed: 1000
            };
            var options = $.extend(defaults, options);

            //Creating a reference to the object
            var objContent = $(this);

            // other inner variables
            var fullPages = new Array();
            var subPages = new Array();
            var height = 0;
            var lastPage = 1;
            var paginatePages=null;
            var numero=0;

            // initialization function
            init = function() {
                objContent.children().each(function(i){
                    if (height + this.clientHeight > options.height) {
                        fullPages.push(subPages);
                        subPages = new Array();
                        height = 0;
                    }

                    height += this.clientHeight;
                    subPages.push(this);
                });

                if (height > 0) {
                    fullPages.push(subPages);
                }

                // wrapping each full page
                $(fullPages).wrap("<div class='page'></div>");

                // hiding all wrapped pages

                objContent.children().hide();


                // making collection of pages for pagination
                paginatePages = objContent.children();


                numero=$(paginatePages).length;

                // show first page
                showPage(lastPage);

            };



            // show page function
            showPage = function(page) {
                i = page - 1; 
                if (paginatePages[i]) {

                    // hiding old page, display new one
                    $(paginatePages[lastPage]).hide();
                    lastPage = i;
                    $(paginatePages[lastPage]).fadeIn(options.fadeSpeed);

                }
            };

            // show pagination function (draw switching numbers)

            // perform initialization
            init();


            //$(document).ready(function(){
            $("#pagination").jPaginator({ 
                nbPages:numero,
                marginPx:5,
                nbVisible:8, 
                overBtnLeft:'#over_backward', 
                overBtnRight:'#over_forward', 
                maxBtnLeft:'#max_backward', 
                maxBtnRight:'#max_forward', 
                onPageClicked: function(a,num) {

                    showPage(num);
                } 
            });
            //});

        }
    });
})(jQuery);

问：  我怎样才能使浏览器rememeber最后显示的页面中的标签，而从片传递到另一个。例如，如果在TAB1显示的最后一页是第5页，点击另一个选项卡，然后再返回TAB1后，我怎么能看到TAB1的第5页？

Question: How can I make the browser rememeber the last shown page in a tab while passing from a tab to another. For example, if the last page shown in tab1 is page5, after clicking on another tab and then returning to tab1, how can I see page5 of tab1?

感谢您的时间。帮助是AP preciated。

Thank you for your time. Help is appreciated.

推荐答案

由于您是AJAX加载每个选项卡中，它失去了所有的状态信息。 据我看到它，你有以下几种选择：

Because you are AJAX loading each of the tabs, it loses all state information. As far as I see it, you have the following options:

不要AJAX加载标签。这意味着更长的加载时间的页面，但不断变化的选项卡之间等待更低。

Don't AJAX load the tabs. This would mean a longer load time for the page but less wait between changing tabs.

的理想：更改标签更改功能检查，如果内容已经被加载。仅在AJAX，如果它尚未完成的含量

IDEAL: Change your tab change function to check if the content has already been loaded. Only AJAX in the content if it hasn't already been done.

保存页面状态变量和页面的每个标签加载时间更改为变量的值。

Save the page state in a variable and change the page to the variable value every time the tab is loaded.