0

Web サイトの上部に、B​​usiness と Personal という名前の 2 つのタブがあります。ページが初めて読み込まれると、[ビジネス] タブのアイテムがタブの下のバーに表示されます。[個人] をクリックすると、個人のアイテムが表示されます。これは私にとってはうまくいきます。ここで、コードの何かを変更したいと思います。パーソナル メニュー項目をクリックすると、ページが更新され、再びビジネス メニュー項目が表示されます。ここのウェブサイトを見てください

ここに私のJqueryコードがあります:

$(document).ready(function() {

    $('.business-tab').show();
    $('.personal-tab').hide();
    $('.business-tab #block-nice_menus-2').hide();
    $('.business-top').children().css('color','#00A2C8');
    $('.personal-top').children().css('color','#000000');
    $('.business-top').click(function(e) {
        e.preventDefault();
        $(this).children().css('color','#00A2C8');
        $('.personal-top a').css('color', '#000000');
        $(this).css('margin-bottom', '0px');
        $('.personal-tab').hide();
        $('.business-tab').show();
        $('.business-tab #block-nice_menus-2').hide();
    });
    $('.personal-top').click(function(e) {
        e.preventDefault();
        $(this).children().css('color','#00A2C8');
        $('.business-top a').css('color', '#000000');
        $(this).css('margin-bottom', '0px');
        $('.personal-tab').show();
        $('.business-tab').hide();
        $('.personal-tab #block-nice_menus-2').show();
        $('.personal-tab #block-nice_menus-1').hide();
    });

});

ページが更新されると、ドキュメントの準備ができているコードを実行することがわかります。個人メニューの下の項目をクリックすると、ページを更新した後、ビジネス メニューとその項目に戻ります。その代わりに、個人的なアイテムを表示したくありません。これどうやってするの ？あなたの助けは本当に感謝しています.

4

2 に答える 2

1

私は私の質問に答えています。私は解決策を見つけたので、それを共有したいので、他の誰もが答えから利益を得ることができます。現在のURLを保存し、それを使用して問題を解決しました。更新されたjqueryコードを見てみましょう。

$(document).ready(function() {

var href = $(location).attr('href');
var substr = href.split('/');
var currentUrl = substr[3];
if( currentUrl == 'personal-mobile' ) {
    $( '.personal-tab' ).show();
    $( '.business-tab' ).hide();
    $( '.personal-tab #block-nice_menus-1' ).hide();
    $( '.personal-top' ).children().css('color','#00A2C8');
    $('.business-top a' ).css('color', '#000000');
}
else {
    $( '.business-tab' ).show();
    $( '.personal-tab' ).hide();
    $('.business-top').children().css('color','#00A2C8');
    $('.personal-top').children().css('color','#000000');
}

$('.business-tab #block-nice_menus-2').hide();

$('.business-top').click(function(e) {
    e.preventDefault();
    $(this).children().css('color','#00A2C8');
    $('.personal-top a').css('color', '#000000');
    $(this).css('margin-bottom', '0px');
    $('.personal-tab').hide();
    $('.business-tab').show();
    $('.business-tab #block-nice_menus-2').hide();
});
$('.personal-top').click(function(e) {
    e.preventDefault();
    $(this).children().css('color','#00A2C8');
    $('.business-top a').css('color', '#000000');
    $(this).css('margin-bottom', '0px');
    $('.personal-tab').show();
    $('.business-tab').hide();
    $('.personal-tab #block-nice_menus-2').show();
    $('.personal-tab #block-nice_menus-1').hide();
});

}）;

于 2011-07-18T06:26:05.833 に答える
1

クッキーを使用できます。

click()ビジネスまたは個人のどちらでブラウジングしているかをクライアントに知らせる Cookie を設定するコードをイベントに追加します。投稿したリンクからコードを直接コピーするだけなので、コードを貼り付けるつもりはありません。しかし、あなたのclick()イベントでは追加したいでしょう

setCookie("navigation_side", 1, 1);

2 番目の引数は、どちら側に移動しているかを示します。私は int を選択しました。string、boolean などを選択できます。

次に、コードの上部に、

if ( getCookie("navigation_side") === 1 ) {
    $('.business-tab').show();
    $('.personal-tab').hide();
} else {
    $('.business-tab').hide();
    $('.personal-tab').show();        
}

適切な有効期限を設定してください。幸運を。

于 2011-07-18T05:42:30.120 に答える