data-i18n 不显示符号

Question

我创建了一个按钮。必须在需要时更改其上的语言。我写了下面的代码来完成任务

var $button = $( '<a class="btn">' )
 .attr( 'href', '#' ).prepend(
 '<span class="fa fa-plus"></span>', ' ' )
 .attr( 'data-i18n', 'text' )
 .tooltip( {
    title: 'change item'
   } );

这成功更改了语言，但不显示图标“+”。

var $button = $( '<a class="btn">' )
   .text( 'sample text' )
   .append( '<span data-i18n="text">sample text</span>' )
   .attr( 'href', '#' ).prepend(
   '<span class="fa fa-plus"></span>', ' ' )
    .tooltip( {
        title: 'change item'
    } );

第二种情况有效并正确显示，包括语言的变化。但是我无法理解第一个代码示例中的错误。谁能帮我吗？提前致谢

Answer 1

您的代码语法无效。在第二个 attr 函数

中的文本变量之后有一个额外的 '

您的代码：

var $button = $( '<a class="btn">' )
 .attr( 'href', '#' ).prepend(
 '<span class="fa fa-plus"></span>', ' ' )
 .attr( 'data-i18n', text' )
 .tooltip( {
    title: 'change item'
 });

有效代码：

var $button = $( '<a class="btn">' )
 .attr( 'href', '#' ).prepend(
 '<span class="fa fa-plus"></span>', ' ' )
 .attr( 'data-i18n', text )
 .tooltip( {
    title: 'change item'
 });

Answer 2

我猜你使用 jquery-i18next:

<a ... data-i18n="text"><span class="fa fa-plus"></span>hello</a> 会将其内容替换为关键文本给出的翻译。所以翻译后你会得到：无论翻译是什么`

像在第二个示例中所做的那样断言仅替换内部跨度而不是锚标记的完整内容。

但你也可以做类似 <a ... data-i18n="[prepend]text">...: https://github.com/i18next/jquery-i18next#prepend-content 的事情来达到同样的效果。

data-i18n 不显示符号

data-i18n doesn't display symbols

jquery

i18next