【问题标题】:How to hard code text which are coming from javascript messages如何对来自 javascript 消息的文本进行硬编码
【发布时间】:2015-11-09 19:57:00
【问题描述】:

我们的应用程序已国际化并更改为不同的语言。出于这个原因,我们必须对所有消息进行硬编码。我们如何为 javascript 中的消息做到这一点?

这就是我们在 html 消息中的做法。

<span th:text="#{listTable.deletedFromTable}">deleted</span>     

我们如何对 javascript 消息进行硬编码。(更新表格)

$('#TableUpdate-notification').html('<div class="alert"><p>Update the Table.</p></div>');

【问题讨论】:

  • 不清楚你在问什么。
  • 在我们的应用程序中,我们正在生成成功消息,并在所有消息都写入属性文件时动态地提醒所有内容。但有些消息来自 JavaScript。我没有找到从 JavaScript 硬编码消息的方法?

标签: javascript hardcoded


【解决方案1】:

您需要从一开始就将消息放入DOM,但不显示它们。将这些文本放在 span 标签中,每个标签都有一个唯一的 idth:text 属性——您可以将它们添加到文档的末尾:

<span id="alertUpdateTable" th:text="#{listTable.updateTable}" 
     style="display:none">Update the Table.</span>

这将确保您的国际化模块也能在此元素上发挥作用,并且即使文本未显示,文本也会被翻译。

然后在您想使用该警报的那一刻,获取该隐藏文本并将其注入您需要的地方:

$('#TableUpdate-notification').html(
'<div class="alert"><p>' + $('#alertUpdateTable').html() + '</p></div>');

您要求提供另一个变体,您目前有:

$successSpan.html(tableItemCount + " item was deleted from the table.", 2000); 

然后,您将再次将此内容添加为未显示的 span,并使用占位符表示计数:

<span id="alertTableItemDeleted" th:text="#{listTable.itemDeleted}" 
     style="display:none">{1} item(s) were deleted from the table.</span>

您应该确保您的翻译也使用占位符。 然后按如下方式使用,在运行时替换占位符:

$successSpan.html($('#alertTableItemDeleted').html().replace('{1}', tableItemCount));

您可以创建一个函数来处理此类占位符的替换:

function getMsg(id) {
    var txt = $('#' + id).html();
    for (var i = 1; i < arguments.length; i++) {
        txt = txt.replace('{' + i + '}', arguments[i]);
    }
    return txt;
}

那么这两个例子就写成如下:

$('#TableUpdate-notification').html(
'<div class="alert"><p>' + getMsg('alertUpdateTable') + '</p></div>');

$successSpan.html(getMsg('alertTableItemDeleted', tableItemCount));

【讨论】:

  • 我们将如何处理以下场景。 $successSpan.html(tableItemCount + " 项目已从表中删除。", 2000);
  • 请把这个放在你原来的问题中,所以我修改后的答案会与它相关。
  • 我已经更新了答案。受您的附加问题的影响,我稍微改变了方法。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-03-12
  • 1970-01-01
  • 2012-01-08
  • 2021-12-22
相关资源
最近更新 更多