Question

我们的网页是使用很多的JavaScript构建的。我在使用本地化文本替换生成的标记中的文本时遇到问题。 JavaScript 不是内联到网页，而是引入了一个指令。 JavaScript中的内容类似于以下内容：

$("#Dynamic-Modal-Content").empty();     
$("#Dynamic-Modal-Content").append("<div class='dynamic_model' id='dynamic_id'>"+
    "<p>Done?</p></div>");

在网页内是

<div id="Dynamic-Modal-Content"></div>

我需要更换＆＃34;完成？＆＃34;本地化的文字，但无法弄清楚如何。我在http://blog.florentlim.com/how-to-write-javascript-including-thymeleaf/#comment-7224上尝试了这个建议，但这没有用。

这是真实代码的简化版本，但有问题的要点。

在这个广阔的世界里，有人提出任何指示吗？

Answer 1

有两种解决方法：

您可以将其他js文件与每个区域设置的文本一起使用，并根据需要使用javascript选择正确的文件。一些ui小部件库在某种程度上使用这种方法。然而，它有两个主要缺点。 Javascript afaik只能解析浏览器中的区域设置，因此如果您在会话中保留区域设置首选项，则仍需要与服务器传递一些通信参数。其次，更重要的是，您无法避免在每个区域设置的不同位置拆分i18n文本 - 一个用于服务器端，一个用于js。
使用html5数据属性。我相信使用html5数据属性是在服务器端和js之间进行数据通信的最简洁方式，而不仅仅是对于i18n。

例如你的div变为：

<div id="Dynamic-Modal-Content" th:attr="data-txt=#{label.done}"></div>

然后使用jQuery，您可以轻松检索所有html5数据属性，就像它们是jQuery数据一样：

$("#Dynamic-Modal-Content").data("txt");

JavaScript，Thymeleaf和本地化文本

1 个答案: