换行符不能与jQuery .text()一起使用

时间:2017-07-24 18:19:59

标签: javascript jquery loops key-value line-breaks

我有以下代码: -

function data(x) {
     var dataList = "";
     for (var key in obj) {
          dataList += key + ": " + obj[key] + "\n"
     }
     $('#modalText').text(dataList);
     document.getElementById('dataModal').style.display='block';
}

它会像这样填充HTML:

<p id="dataList"></p>

虽然循环的每次迭代都有一个'\ n'连接到我的字符串,但是在我的模态中显示每个键/值对之后我无法获得换行符。我也试过jQuery .append()函数而不是.text(),但没有用。

我的变量dataList在控制台中打印正确的换行符,如下所示:

key: 123
time: 12:00
department: taxes

但是当在模态中打印时,没有换行符:

key: 123 time: 12:00 department: taxes

如何在控制台中显示每个键值对后,在我的模态中显示新的换行符?

2 个答案:

答案 0 :(得分:2)

Whitespace在HTML中没有任何意义。您需要使用<br/>并设置.html(),或者需要在dataList white-space: pre标记中添加<p>。使用prepre-wrap将尊重空格(因此\ n \ n字符)

答案 1 :(得分:0)

简单地<br>足以获得换行而非“/ n”,如下面的代码所示。

 function data(x) {
 var dataList = "";
 for (var key in obj) {
      dataList += key + ": " + obj[key] + "<br>"
 }
 $('#modalText').text(dataList);
 document.getElementById('dataModal').style.display='block';

}