通过javascript提取文本时如何在textarea上保留文本\r\n格式答案

【问题标题】：How to keep text \r\n formatting on a textarea when you pull the text via javascript通过javascript提取文本时如何在textarea上保留文本\r\n格式
【发布时间】：2020-06-22 17:16:22
【问题描述】：

长话短说，我有一个文本区域，我想用正确的换行符保留格式。我通过以下 javascript 调用获取文本区域的值。

var letterText = document.getElementById("cnl-lettertext").value;

之后，我通过 Ajax 调用和 rest api 将其发送到数据库中。由于某种原因，当我设置它时，我似乎无法让它在变量中保留 \r\n 字符或换行符。

我尝试在我的 css 上设置 white-space: pre ，但这似乎不起作用。我也不想只使用 .replace，因为这会破坏其他功能。

ajax 调用：

$.ajax({
    url : url, //url is built dynamically for a rest api.
    timeout : 5000,
    dataType : "json",
    statusCode : {  },
    success : function(data) {
                            
    
    }
});

【问题讨论】：

请出示您的 Ajax 调用。我猜你没有对值进行编码（例如encodeURIComponent(letterText)），但是如果没有看到代码就很难分辨
stackoverflow.com/questions/29574876/…
@blex 我继续添加了我的 ajax 调用。
"url 是为 rest api 动态构建的。" 'https://...' + encodeURIComponent(letterText) + '...'
很棒的@blex。这就像一个魅力！

标签： javascript formatting textarea

【解决方案1】：

当您向带有换行符的 URL 发送请求时，浏览器将删除那些与 URL 不兼容的换行符。它们需要被编码。

您可以使用 encodeURIComponent 手动执行此操作，但由于您使用的是 jQuery，因此请利用它，并使用 data 选项以正确的方式传递查询参数。它们将被 jQuery 正确编码：

$.ajax({
    url : 'https://www.example.com/endpoint', // don't add query params here
    timeout : 5000,
    dataType : "json",
    data: { // Add them here, they will be encoded automatically
      letterText: letterText,
      // ...
    },
    statusCode : {  },
    success : function(data) {}
});

【讨论】：