如何使用 i18next 翻译部分 HTML 文本

How to translate partial HTML text with i18next?

本文关键字:HTML 文本 翻译部 何使用 i18next      更新时间:2023-09-26

在这里完成i18next 菜鸟,所以请耐心等待!

我的HTML是:

<ul class="nav nav-sidebar">
  <li><a href="#">Sección 1.1</a></li>
  <li><a href="#">Sección 1.2</a></li>
  <li><a href="#">Sección 1.3</a></li>
</ul>
<input type="text" id="Doc" name="Doc" data-i18n="[placeholder]mykey" placeholder="Document" />

我用这个javascript代码加载我的翻译:

i18n.init(
    {
        lng: $.cookie("i18next"),
        fallbackLng: "es",
        debug: true,
        resGetPath: "dist/js/i18n/___lng__.js",
    },
    function (t) {
        $(document).i18n();
    }
);

如何在每个li上声明我的data-i18n标签,这样我只需要为内部HTML的"Sección"部分提供一个键,并在之后保留1.1,1.2,1.3?

您需要

data-i18n标签添加到您的 html 中

<a href="#" data-i18n="menu.home">Home</a>

我为你举了一个例子:

链接到我的JSBINb

以下是您可以考虑的其他示例用法:http://i18next.com/pages/sample.html

或者,如果您正在寻找嵌套用法,则可以使用$t()

例如:

'en-US': { 
    translation: { 
      'menu': {
        'taipei': 'Taipei, $t(menu.country)',
        'tainan': 'Tainan, $t(menu.country)',
        'kenting': 'Kenting, $t(menu.country)',
        'country': 'Taiwan'
      }                           
    } 
  }

我已经更新了 jsbin。希望这就是你要找的