HTML 两种语言的input- label，可以吗？

Question

我的问题很简单，但是我想不出来，因为我不太擅长网络编程。

是否可以为 .html 页面设置多语言标签/输入值？

如果默认浏览器语言是意大利语，我需要显示一些文本，如果浏览器使用其他语言，我需要显示另一个文本。例如，我需要自动从 Ciao 切换到 Hello。

有办法实现吗？也许我可以用 Javascript...

谢谢大家

Answer 1

有很多不同的方法可以解决这个问题，我建议您花一些时间搜索 google 并找到最适合您需要的方法。

我会给你一个我喜欢用的例子，但请记住，我发布的信息只是多种可能方法中的一种。

首先，您必须获得用户的语言。为此，您可以使用地理定位并将语言基于用户所在的位置（有关执行此操作的信息，请参阅 this answer for a good way, or search google and use one of many other approaches), or you can get it from the user's browser (see this 线程）。

一旦你有了它，就只需要向用户显示本地化的内容了。我的首选方法如下，它将所有变体组合到一个文件中（替代方法使用多个不同的 HTML 文件）：

首先你有你的 HTML:

<body>
    <h2>
        <span class="lang lang_en">This is in english!</span>
        <span class="lang lang_it">Questo è in italiano!</span>
    </h2>
</body>

文本的每个版本都存在于自己的范围内。然后在你的 CSS 中隐藏所有 spans:

.lang{
    display:none;
}

最后，在 JS 中，我们仅显示包含我们要显示的语言的文本的 span：

var lang = ...; //language
switch (lang) {
    case "en":
        $(".lang_en").css("display", "inline");
        break;
    case "it":
        $(".lang_it").css("display", "inline");
        break;
    default:
        // Set your default language here
}

当然，这种方法是否适合您取决于您的需要。我喜欢它，因为它不依赖于 JQuery 之外的任何框架，而且易于理解。当然，根据您的需要，它甚至可能效率低得令人望而却步（非常非常大的网页就是这种情况）。由你决定。

Answer 2

如果你想获取的是浏览器语言，可以通过以下代码获取：

navigator.language || navigator.userLanguage

否则，只需创建一个下拉列表或 onChange 的东西，只需将变量更改为 localStorage:

localStorage.setItem('language', languageValue)

然后每次检查：

localStorage.getItem('language')

有了它，您将能够仅使用 js 更改所有内容/重定向到保存语言的其他页面。

HTML 两种语言的input- label，可以吗？

HTML two language input- label, is it possibile?

html

javascript

css

multilingual