2

我编写了一个脚本,通过该网站http://www.martyregan.com/告诉多个 div ,通过单击“网站语言”按钮从英文 div 切换到日文 div。

它以我喜欢的方式工作,尽管我的客户想知道 DIV 在转到另一个页面时是否可以留在日文 DIV 上。

该脚本当前告诉第一个子类(两个相应的 div)显示和隐藏任何其他共享该类的内容。

它还告诉第一个子类是活动的,所以我想有一种方法可以实现某种缓存/内存脚本来处理它。

    $(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 回答