2

この Web サイトhttp://www.martyregan.com/を介して複数の div に、[Web サイトの言語] ボタンをクリックして英語の div から日本語の div に切り替えるように指示するスクリプトを作成しました。

私のクライアントは、別のページに移動するときに DIV が日本語の DIV にとどまることが可能かどうかを知りたがっていますが、私が望むように機能します。

スクリプトは現在、(対応する 2 つの div の) First Child クラスに、そのクラスを共有する他のクラスを表示および非表示にするように指示します。

また、最初の子クラスがアクティブになるように指示するので、これを操作するためにある種のキャッシュ/メモリ スクリプトを実装する方法があると思います。

    $(function() {
$('#left-sidebar-inner .ddsmoothmenu-v, #right-sidebar-inner .ddsmoothmenu-v, #pb_sidebar .ddsmoothmenu-v, #main-content-inner .content, #main-content-inner .contact, #main-content-inner .right, #main-content-inner .program, #main-content-inner .worksnav, #main-content-inner .worksnav2, #main-content-inner .heading').hide();
$('#left-sidebar-inner .ddsmoothmenu-v:first, #right-sidebar-inner .ddsmoothmenu-v:first, #pb_sidebar .ddsmoothmenu-v:first, #main-content-inner .content:first, #main-content-inner .contact:first, #main-content-inner .right:first, #main-content-inner .program:first, #main-content-inner .worksnav:first, #main-content-inner .worksnav2:first, #main-content-inner .heading:first').show();
$('#language a:first').addClass('active');

$('#language a').click(function() {
if ($(this).hasClass('active') == true) {
    return false;
}
else {
    $('a.active').removeClass('active');
    $(this).addClass('active');

    $('#left-sidebar-inner .ddsmoothmenu-v, #right-sidebar-inner .ddsmoothmenu-v, #pb_sidebar .ddsmoothmenu-v, #main-content-inner .content, #main-content-inner .contact, #main-content-inner .right, #main-content-inner .program, #main-content-inner .worksnav, #main-content-inner .worksnav2, #main-content-inner .heading').fadeOut();
    var contentToLoad = $(this).attr('href');
    $(contentToLoad).fadeIn();

    return false;
}
});
});

これが私が与えられた例です：

$('a.en').click(function(){
localStorage.setItem('language', 'en');
});

$('a.fr').click(function(){
localStorage.setItem('language', 'fr');
});

// to get the language value use getItem
localStorage.getItem('language');
4

1 に答える 1

1

あなたの質問はすぐに解決できるので、これはフリーランサーなら誰でも解決できるともう一度言うのではなく、私が解決したことを願っています ;)

テスト環境を作成するにはかなりの労力がかかるため、これはテストされていません。

動作するはずですが、言語選択のリンクに html id タグを追加すると、 

<div id="language">
    <a id="en" href="#mainnaven, #contenten, #contacten, #works_righten, #works_programen,  #worksnaven,  #worksnav2en, #works_headen" class="">
        <img src="http://www.martyregan.com/files/1413/5826/9756/en.png">
    </a>
    <a id="jp" href="#mainnavjp, #contentjp, #contactjp, #works_rightjp, #works_programjp, #worksnavjp, #worksnav2jp, #works_headjp" class="active">
        <img src="http://www.martyregan.com/files/5213/5826/9759/jp.png">
    </a>
</div>

div に追加した id="en" と id='jp' に注目してください。

それが不可能な場合は、さらに数行追加する必要があります。

スクリプトは次のようになります。

jQuery(function($) {
  var language = localStorage.getItem('language');

  if(!language) {
    language = "en";
  }

  $('#left-sidebar-inner .ddsmoothmenu-v').fadeOut(function(){

    var link =  $('#'+language);
    var contentToLoad = link.attr('href');

    $('.active').removeClass('active');
    link.addClass('active');

    $(contentToLoad).fadeIn();
  });


  $('#left-sidebar-inner .ddsmoothmenu-v').show();
  $('#language a:first').addClass('active');

  $('#language a').live('click',function() {

    if ($(this).hasClass('active') == true) {
        return false;
    } else {
        $('a.active').removeClass('active');
        $(this).addClass('active');

        var language = 'jp';
        if($(this).attr('href').indexOf('mainnaven') > 0 ) {
          language = 'en'
        }

        localStorage.setItem('language', language);

        $('#left-sidebar-inner .ddsmoothmenu-v').fadeOut();
        var contentToLoad = $(this).attr('href');

        $(contentToLoad).fadeIn();

        return false;
    }
  });
});

楽しんで

ジャシャ

于 2013-02-08T07:34:23.943 に答える