javascript - 将多个文本区域保存到可下载的 .txt 文件中并保持格式

Question

我正在开发一个项目，要求用户在填写多个文本区域后生成 .txt 文件。但是，这些文本区域中需要保留格式(特别是换行符)。我研究和改编的代码将其包装成一个 blob，(我认为)这就是问题所在，导致 .txt 简单地将所有文本区域的内容连接成连续的行。

HTML:

<input id="fileInput"></input><br>
<textarea id="text1Input" cols="80" rows="25"></textarea><br>
<textarea id="text2Input" cols="80" rows="25"></textarea><br>
<button onclick="saveTextToFile()">Save Text to File</button>

JS:

function saveTextToFile() {
    var textToSave = document.getElementById("text1Input").value + "\n\ntext2Input\n\n" + document.getElementById("text2Input").value;
    var textToSaveAsBlob = new Blob([textToSave], {type:"text/plain"});
    var textToSaveAsURL = window.URL.createObjectURL(textToSaveAsBlob);
    var fileNameToSaveAs = document.getElementById("fileInput").value;

    var downloadLink = document.createElement("a");
    downloadLink.download = fileNameToSaveAs;
    downloadLink.innerHTML = "Download File";
    downloadLink.href = textToSaveAsURL;
    downloadLink.onclick = destroyClickedElement;
    downloadLink.style.display = "none";
    document.body.appendChild(downloadLink);

    downloadLink.click();
  }

  function destroyClickedElement(event) {
    document.body.removeChild(event.target);
  }

关于如何实现生成 .txt 文件以维护文本区域中写入的行和 php 连接中指定的换行符的目标，有什么想法吗？

Answer 1

Blob 对象没问题。您看不到换行符，因为 \n 不是 Windows 换行符，并且某些编辑器不显示它。如果您在 Notepad++ 中打开文件，您会看到正确的换行符。然而，记事本显示连接的文本。

您需要将 Javascript 中的 \n 替换为 \r\n。使用正则表达式:

var textToSave = document.getElementById("text1Input").value.replace(/([^\r])\n/g, "$1\r\n") + "\r\n\r\ntext2Input\r\n\r\n" + document.getElementById("text2Input").value.replace(/([^\r])\n/g, "$1\r\n");