如何从 textarea 值显示用户输入的换行符？答案

【问题标题】：How to display user inputted line breaks from a textarea value?如何从 textarea 值显示用户输入的换行符？
【发布时间】：2022-02-06 12:53:45
【问题描述】：

我正在创建一个有两个页面的程序：一个用于通过textarea 将文本作为form 输入到数据库中，另一个用于获取所述数据并将其显示在textarea 上。但是，提交带有缩进的文本（作为用户按下回车按钮的产物），获取和显示信息的页面会中断，我知道原因但不知道如何解决。

提交表单的页面：

<!--Form-->
   <div class="container">
      <form action="/spaceData" method="POST">
            <br>
               <textarea value="" id="textbox" name="usertext" maxlength="100" placeholder="Write your fortune:" onchange="handleChange(this)"></textarea>
            </br>
         </div>
         <div class="container">
            <button type="submit" id="submit" onclick="return handleChange()">Contribute Wisdom</button>
         </div>
      </form>
   </div>

显示数据的页面是一个 ejs 文件，它检索提交的文本值，如下所示：

let text = "<%= text %>";

但是，对于带有缩进的字符串，变量会中断。例如，假设用户输入字符串：

hello
world
!

ejs 文件会将变量显示为：

let text = "hello
world
!";

这会导致程序中断。如何让text 变量检测换行符？

我想也许我可以在提交之前对字符串进行迭代，如果检测到缩进，可以将其替换为 \n，但我不确定如何实现这一点，或者它是否能解决问题.

感谢您的建议。

【问题讨论】：

你为什么不改用template literals？
你的意思是像let text = <%= `${text}` %>;这样的东西吗？因为这似乎并没有将变量保存为字符串，例如：let text = hello world! 与let text = "hello world!" 相对应

标签： javascript html string forms textarea

【解决方案1】：

这是因为 html 和 js 换行符的工作方式不同。

任何情况。文本区域在您输入它们时发送此特征线如果你想在你的前端启用这些换行符，只需在你想要呈现这些文本区域信息的区域添加这个 css 例如：变成一个“p”标签

在

p {
  white-space: pre-wrap;
}

或在 html 中：

<p style="white-space: pre-wrap"> {textarea} </p>

textarea 可以注册所有这些断线。但是当它发送到数据库时，js中没有表单，你可以看到断线。我知道如何解释它，但隐藏了这些
行

【讨论】：