使用JSON当我显示我的HTML时，我想做一个换行符 [英] Using json I want to do a line break when I display my html

问题描述

我想在我的json结构中使用< br> 显示我的html，但是它不工作

我的translate.js文件：

$ $ $ $ $（$函数（）{

//对象字面表现为多字典
字典= {
fr：{
menu：{
about：ÀPROPOS，
services：SERVICES，
portfolio：PORTFOLIO，
pricing：TARIF，
contact：CONTACT
}，
weSpecializeIn：Ingénierie。< br>Systèmes。< br>电子学< br> Logiciel

}，
en： {
menu：{
about：ABOUT，
services：SERVICES，
portfolio：PORTFOLIO，
定价：定价，
联系方式：联系人
}，
weSpecializeIn：工程系统。< br> El ectronics< br> ;. <峰; br>软件

};

//交换字典的函数
set_lang =函数（字典）{
$（[data-translate] ）.text（function（）{
var key = $（this）.data（translate）;
return parseSubObject（dictionary，key）;
}）;
};

function parseSubObject（obj，str）{
var props = str.split（。）;

var thisProp = props.shift（ ）;
if（obj.hasOwnProperty（thisProp））{
if（props.length == 0）{
return obj [thisProp];
} else {
return parseSubObject（obj [thisProp]，props.join（'。'））;
}
} else {
return null;
}
}

//在菜单更改时交换语言
$（。lang）。click（function（）{
var language = $（this）.text（）。toLowerCase（） ;
if（dictionary.hasOwnProperty（language））{
set_lang（dictionary [language]）;
}
}）;

//将初始语言设置为法语
set_lang（dictionary.fr）;

}）;

显示翻译的范围

 < span data-translate =weSpecializeIn>< / span> 
  

显示的结果是整个ligne：

法语：

 Ingénierie。 <峰; br> Systèmes的。 <峰; br>电子展览会。 <峰; br> Logicie 
  

中文：

 工程。 <峰; br>系统。 <峰; br>电子产品。 <峰; br>软件
  

期待展示：

法语：

 Ingénierie。 
Systèmes。 
电子。 
 Logiciel 
  

中文：

 工程。 
系统。 
电子。 
 Software 
  

解决方案

/ p>

我不得不使用.html（）而不是.text（）解决方案：$ / $>


$ b

  set_lang =函数（字典）{
 $（[data-translate]）。html（function（）{
 var key = $（this）.data（translate）; 
 return parseSubObject（dictionary，key）; 
}）; 
}; 
  

而不是：

 （$ {code> set_lang = function（dictionary）{
 $（[data-translate]）。text（function（）{
 var key = $（this）.data ）; 
 return parseSubObject（dictionary，key）; 
}）; 
}; 
  

I wanted to do a line break when I display my html using <br> in my json structure, but It doesn't work

my translate.js file:

$(function () {

    // Object literal behaving as multi-dictionary
    dictionary = {
      "fr": {
        "menu": {
          "about": "À PROPOS",
          "services": "SERVICES",
          "portfolio": "PORTFOLIO",
          "pricing": "TARIF",
          "contact": "CONTACT"
        },
        "weSpecializeIn": "Ingénierie. <br> Systèmes. <br> Électronique . <br> Logiciel"

      },
      "en": {
        "menu": {
          "about": "ABOUT",
          "services": "SERVICES",
          "portfolio": "PORTFOLIO",
          "pricing": "PRICING",
          "contact": "CONTACT"
        },
        "weSpecializeIn": "Engineering. <br> Systems. <br> Electronics <br>. <br> Software"   
      }
    };

    // Function for swapping dictionaries
    set_lang = function(dictionary) {
      $("[data-translate]").text(function() {
        var key = $(this).data("translate");
        return parseSubObject(dictionary, key);
      });
    };

    function parseSubObject(obj, str) {
      var props = str.split(".");

      var thisProp = props.shift();
      if (obj.hasOwnProperty(thisProp)) {
        if (props.length == 0) {
          return obj[thisProp];
        } else {
          return parseSubObject(obj[thisProp], props.join('.'));
        }
      } else {
        return null;
      }
    }

    // Swap languages when menu changes
    $(".lang").click(function() {
      var language = $(this).text().toLowerCase();
      if (dictionary.hasOwnProperty(language)) {
        set_lang(dictionary[language]);
      }
    });

    // Set initial language to French
    set_lang(dictionary.fr);

});

my span displaying the translation

<span data-translate="weSpecializeIn"></span>

The displayed result was the whole ligne :

French:

Ingénierie. <br> Systèmes. <br> Électronique. <br> Logiciel

English:

Engineering. <br> Systems. <br> Electronics. <br> Software

Expecting to display:

French:

Ingénierie. 
Systèmes. 
Électronique. 
Logiciel

English:

Engineering.
Systems.
Electronics.
Software

解决方案

I found the solution:

I have to use .html() instead of .text()

Solution:

set_lang = function(dictionary) {
      $("[data-translate]").html(function() {
        var key = $(this).data("translate");
        return parseSubObject(dictionary, key);
      });
};

instead of :

set_lang = function(dictionary) {
      $("[data-translate]").text(function() {
        var key = $(this).data("translate");
        return parseSubObject(dictionary, key);
      });
};

这篇关于使用JSON当我显示我的HTML时，我想做一个换行符的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！