从javascript代码创建多行文本文件

Question

我已找到此代码，但是单击“下载”按钮时无法创建多行文本文件。 似乎全部是一串文字...我尝试了多种连接方式，但都没有效果...

我无法弄清楚我错过了哪一块！

干杯:)

 function download(filename, text) { var element = document.createElement('a'); element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text)); element.setAttribute('download', filename); element.style.display = 'none'; document.body.appendChild(element); element.click(); document.body.removeChild(element); } // Start file download. document.getElementById("dwn-btn").addEventListener('click', function(){ // Generate download of hello.txt file with some content var text = `A rather long string of English text, an error message actually that just keeps going and going -- an error message to make the Energizer bunny blush (right through those Schwarzenegger shades)! Where was I? Oh yes, you\\'ve got an error and all the extraneous whitespace is just gravy. Have a nice day`; var filename = "hello.txt"; download(filename, text); }, false); 

 <input type="button" id="dwn-btn" value="Download" /> 

Answer 1

请参阅： ES6 JavaScript中的多行字符串

您的问题是您没有从文字处理器或记事本（保留新行）中检索文本。 您正在使用代码定义字符串值IN-LINE。

更新：将函数调用合并到字符串中。

---

您要么需要在每行的末尾放置文字换行符。

 function download(filename, text) { var element = document.createElement('a'); element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text)); element.setAttribute('download', filename); element.style.display = 'none'; document.body.appendChild(element); element.click(); document.body.removeChild(element); } function getLastUpdated() { return `\\nLast updated: ${new Date().toISOString()}`; } // Start file download. document.getElementById("dwn-btn").addEventListener('click', function(){ // Generate download of hello.txt file with some content var text = `A rather long string of English text, an error message \\n actually that just keeps going and going -- an error \\n message to make the Energizer bunny blush (right through \\n those Schwarzenegger shades)! Where was I? Oh yes, \\n you\\'ve got an error and all the extraneous whitespace is \\n just gravy. Have a nice day \\n ${getLastUpdated()}`; var filename = "hello.txt"; download(filename, text.replace(/\\n/g, '\\n\\r')); // Convert LF ro LFCR }, false); 

 <input type="button" id="dwn-btn" value="Download" /> 

或者，将线连接到数组内部。 没有其他方法可以做到这一点。 反斜杠和反斜杠会忽略换行符。 视觉上在代码中包含换行符不会转换为文本中的换行符。 它只是使您更容易看到新行。

 function download(filename, text) { var element = document.createElement('a'); element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text)); element.setAttribute('download', filename); element.style.display = 'none'; document.body.appendChild(element); element.click(); document.body.removeChild(element); } function getLastUpdated() { return `\\n\\nLast updated: ${new Date().toISOString()}`; } // Start file download. document.getElementById("dwn-btn").addEventListener('click', function(){ // Generate download of hello.txt file with some content var text = [ 'A rather long string of English text, an error message', 'actually that just keeps going and going -- an error', 'message to make the Energizer bunny blush (right through', 'those Schwarzenegger shades)! Where was I? Oh yes,', 'you\\'ve got an error and all the extraneous whitespace is', 'just gravy. Have a nice day', getLastUpdated() ].join('\\n'); var filename = "hello.txt"; download(filename, text.replace(/\\n/g, '\\r\\n')); // Convert LF ro CRLF }, false); 

 <input type="button" id="dwn-btn" value="Download" /> 

Answer 2

您可以在此用例中使用反引号（`）吗？

像这样的东西：

var text = `A rather long string of English text, an error message 
actually that just keeps going and going -- an error 
message to make the Energizer bunny blush (right through 
those Schwarzenegger shades)! Where was I? Oh yes,
you've got an error and all the extraneous whitespace is
just gravy.  Have a nice day.`;