19

我正在研究i18next本地化库的可能性。

现在我有以下代码（完整的小提琴在这里）：

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();
        });
    });
});

它翻译所有text元素，但问题是我无法翻译custom attributes。例如，div 内的文本已翻译，但我不明白如何翻译自定义属性，如placeholder和value。

另一个问题是我的翻译方式。每当单击按钮Chi时Eng，我都会初始化翻译（但我不确定这是正确的方法）。编辑我想我找到了解决这个问题的方法（我需要使用 setLng）：i18n.setLng(lang, function(t) { ... })

4

3 回答 3

41

在直接向i18next 创建者询问这个问题后，我收到了以下回复：我所需要的只是将我的自定义属性放在翻译元素的前面。这是一个例子：

<div data-i18n="[title]titleTransl"></div>
<input data-i18n="[placeholder]placeTransl" value="name">

如果需要多个属性，请用 . 分隔它们;。

我从中学到了两件事：

  • 我必须阅读更好的文档。
  • 118next 的创作者真的很有帮助（这是对他的感谢）。
于 2014-04-02T20:24:17.077 回答
11

对我来说，以下工作

<input data-i18n="[placeholder]placeTransl" value="name">

因此，只需在 [] 之间输入属性名称，然后输入翻译。

于 2014-09-16T13:41:24.517 回答
0

考虑打电话

$('body').i18n()

在 .done() 函数内部。您应该告诉在哪里寻找定位器。这无需在 data-i18n 属性中调用 [placeholders] 即可工作。

于 2020-05-06T11:45:39.563 回答