Question

我创建了一个按钮。必要时，必须更改其中的语言。我编写了以下代码来完成任务

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

这成功地改变了语言，但它没有显示图标＆＃34; +＆＃34;。

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不显示符号

2 个答案: