Question

可能这不是很难做到但JS背景中没有这么难以理解。我正在尝试在cookie中存储选定的选项卡，因此如果页面刷新仍然会更早显示选定的选项卡。

我已经在我的网站上使用列表网格布局，并且还设置了cookie并且工作正常。我正在发布我正在使用的cookie代码以及我的标签html和javascript。

列表/网格Cookie JS

    $(function() {
        var cc = $.cookie('list_grid');
        if (cc == 'g') {
            $('#listgrid').addClass('grid');
            $('#grid').addClass('current');            
        } else {
            $('#listgrid').removeClass('grid');
            $('#list').addClass('current');
        }
    });

$(document).ready(function() {

    $('#grid').click(function() {
        $(".current").removeClass("current");
        $(this).addClass("current");

        $('#listgrid').fadeOut(500, function() {
            $(this).addClass('grid').fadeIn(500);
            $.cookie('list_grid', 'g');
        });
        return false;
    });

    $('#list').click(function() {
        $(".current").removeClass("current");
        $(this).addClass("current");

        $('#listgrid').fadeOut(500, function() {
            $(this).removeClass('grid').fadeIn(500);
            $.cookie('list_grid', null);
        });
        return false;
    });

});

我的标签HTML

Tab 1

Tab 2

Tab 3

<div class="tabs">

    <div id="tab1" class="tab">
    </div>

    <div id="tab2" class="tab">
    </div>

    <div id="tab3" class="tab">
    </div>
</div>

标签JS jQuery（document）.ready（function（）{ //如果这不是第一个标签，请隐藏它 jQuery的（ “标签：否（：第一）”）。隐藏（）;

    //to fix u know who
    jQuery(".tab:first").show();

    //when we click one of the tabs
    jQuery(".htabs a").click(function () {

        $(".current").removeClass("current");
        $(this).addClass("current");

        //get the ID of the element we need to show
        stringref = jQuery(this).attr("href").split('#')[1];
        //hide the tabs that doesn't match the ID
        jQuery('.tab:not(#' + stringref + ')').hide();
        //fix
        if (jQuery.browser.msie && jQuery.browser.version.substr(0, 3) == "6.0") {
            jQuery('.tab#' + stringref).show();
        } else
        //display our tab fading it in
        jQuery('.tab#' + stringref).fadeIn();
        //stay with me
        return false;

    });

});

所以有人可以帮我做这件事。

Answer 1

我认为最好使用this

的jquery ui标签

jQuery(document).ready(function () { 

// get the cookie
 var tabcookie = $.cookie('tab');    
 if (tabcookie){
     jQuery('.tab:not(#' + tabcookie + ')').hide();
     jQuery('.tab#' + tabcookie ).show();    
 }else{
      jQuery(".tab:not(:first)").hide();

    //to fix u know who
    jQuery(".tab:first").show();
 }


//when we click one of the tabs
jQuery(".htabs a").click(function () {

    $(".current").removeClass("current");
    $(this).addClass("current");

    //get the ID of the element we need to show
    stringref = jQuery(this).attr("href").split('#')[1];        
    //hide the tabs that doesn't match the ID
    jQuery('.tab:not(#' + stringref + ')').hide();

    // save the cookie
    $.cookie('tab', stringref);


    //fix
    if (jQuery.browser.msie && jQuery.browser.version.substr(0, 3) == "6.0") {
        jQuery('.tab#' + stringref).show();
    } else
    //display our tab fading it in
    jQuery('.tab#' + stringref).fadeIn();
    //stay with me
    return false;

});

}）;

Jquery选项卡cookie使用现有脚本

1 个答案: