0

我有一个语言选择器的 jQuery 下拉列表。目前我有一个关于它如何工作的框架设置，但我对如何启动活动的 jQuery 函数感到很困惑。

我想做的是当用户从列表中单击一种语言时，语言名称（或将来的标志）将出现在“当前 div 类”的顶部。

当前类中的默认值是英语列表项。

我不确定如何开始，但从研究中我发现我可以创建if statement和使用这些append/prepend元素？我朝着正确的方向前进吗？

我正在使用 Codeigniter 并创建了一个语言翻译器，因此在具有 html 锚标记的内部，我的 php 是这样编写的：

<li id="french"><?php echo anchor('fr/'.strtolower($page_info['fr_title']), 'FR'); ?></li>

这是一个关于它当前设置的粗略原型的链接。任何教程或指导将不胜感激。

如果语言是法语，则显示法国国旗等：

$(function() {
    if ( document.location.href.indexOf('en') > -1 ) {
        alert('english');
    } else {
        if ( document.location.href.indexOf('ru') > -1 ) {
            alert('russian');
        }else {
            if ( document.location.href.indexOf('fr') > -1 ) {
                alert('french');
            }else {
                if ( document.location.href.indexOf('fr') > -1 ) {
                    alert('french');    
                    }
                }
            }
        }
    });

谢谢！

链接：http: //jsfiddle.net/Wmb4n/2/

4

3 回答 3

1

检查这个小提琴

$('#lang_selector ul li').click(function () {
    $('.current').text($(this).text());    
});

编辑： 您的if.. else陈述需要清理。

$('#lang_selector ul li').click(function () {
    $('.current').text($(this).text());
var loc = document.location.href;
    if (loc.indexOf('en') > -1) {
        alert('english');
    } else if (loc.indexOf('ru') > -1) {
        alert('russian');
    } else if (loc.indexOf('fr') > -1) {
        alert('french');
    } else if (loc.indexOf('fr') > -1) {
        alert('french');
    }
});
于 2013-06-25T09:42:42.723 回答
0

好的，所以user1671639回答了我上面的问题，但另一个问题是页面正在刷新新的语言内容，这意味着所选的 div 在页面加载之前闪烁。我也试过$('#lang_selector ul li').click(function (e) { $('.current').text($(this).text()); e.preventDefault(); });

这使所选项目保持活动状态，但随后不会使用语言内容刷新页面。

我不确定这是否是正确的方法，但如果有人能想到一个更简单的解决方案，那就太好了。

我已经添加了一个指向我的脚本的链接，但由于图像和 php 不包含在其中，因此无法正常工作。基本上，当用户选择列表中的图标时，页面会被刷新，然后 jQuery 检查 url 是否具有 fr 或 en ect，如果是，则将 li id = french 与图像附加到当前跨度上。

链接：http: //jsfiddle.net/Wmb4n/7/

这有效：

$(function() {
    var loc = document.location.href;

        if (loc.indexOf('en') > -1) {
            $("span.current").append(english);

        } else if (loc.indexOf('ru') > -1) {
            $("span.current").append(russian);

        } else if (loc.indexOf('fr') > -1) {
            $("span.current").append(french);

        } else if (loc.indexOf('de') > -1) {
            $("span.current").append(german);
        }
    });

要更改锚标记中的语言翻译是这样的：

<?php echo anchor('fr/'.strtolower($page_info['fr_title']), 'FR'); ?>
于 2013-06-25T10:37:35.143 回答
0

不知道这是否是你想要的..

试试看..

 $(document).ready(function(){
    $('.current').click(function(){
    $(this).siblings('ul').slideToggle();
});
    $('ul li').click(function(){
      $(this).parent().prev('span').text($(this).text());
    });
});

在这里摆弄

于 2013-06-25T09:40:24.783 回答