Estou investigando o que é possível comi18next biblioteca de localização.

No momento, tenho o seguinte código (Fiddle completo está aqui):

HTML

<div data-i18n="title"></div>
<input placeholder="Hello" value="name">
<div class="holder"></div>
<button class="lang" data-lang="en">Eng</button>
<button class="lang" data-lang="ch">Chi</button>

JS

$(document).ready(function () {
    i18n.init({
        "lng": 'en',
        "resStore": resources,
        "fallbackLng" : 'en'
    }, function (t) {
        $(document).i18n();
    });

    $('.lang').click(function () {
        var lang = $(this).attr('data-lang');
        i18n.init({
            lng: lang
        }, function (t) {
            $(document).i18n();
        });
    });
});

Traduz tudotext elementos, mas o problema é que não consigo traduzircustom attributes. Por exemplo, o texto dentro da div é traduzido, mas não consigo entender como traduzir atributos personalizados, comoplaceholder evalue.

Outro problema está no meu modo de tradução. Sempre que um botãoChi, Eng é clicado, estou inicializando a tradução (mas não tenho certeza se esta é uma maneira correta).Editar Acho que encontrei como resolver esse problema (preciso usar o setLng):i18n.setLng(lang, function(t) { ... })