如何显示三行而不是一行

【问题标题】：How can I display three line Instead of one line如何显示三行而不是一行
【发布时间】：2020-05-18 19:42:23
【问题描述】：

我正在我的网站上创建一个笔记应用程序。我的文本区域中有输入代码

<textarea class="form-control" rows="3" name="postBody"></textarea>

当我在文本框中输入文本时，我的文本框：

123
345
789

-> 我希望以这种方式显示 3 行，

但我得到的显示是

123 456 789

我该如何解决这个问题？？

【问题讨论】：

标签： javascript input textarea display enter

【解决方案1】：

您可以使用white-space: pre-wrap 属性来显示带有换行符的文本。

div {
    white-space: pre-wrap;
}

示例：

function sanitize(string) {
  const map = {
    "&": "&amp;",
    "<": "&lt;",
    ">": "&gt;",
    '"': "&quot;",
    "'": "&#x27;",
    "/": "&#x2F;"
  };
  const reg = /[&<>"'/]/gi;
  return string.replace(reg, match => map[match]);
}
function display() {
  let elem = document.getElementById("content");
  document.getElementById("display").innerHTML = sanitize(elem.value);
}

    <textarea id="content">
123
      345
      789</textarea
    >

    <div id="display"></div>

    <button onclick="display()">Display</button>

【讨论】：

已更新。谢谢