Javascript 用换行符复制到剪贴板

我想将一个文本复制到剪贴板，但在一个新行中

问题:

如果单击代码段中的按钮并粘贴到记事本中，您将得到以下结果：

姓名：TestName:testEmail:test@gmail.comAddress：testCity:testCountry:nullAd类别：testPlan:nullAd网站：公司名称：testΜήνμα：test

我想要的是：

如果可能的话，我想用换行符复制文本。与复制时相同：

名称：测试 姓：test 电邮：test@gmail.com

函数copyToClipboardelement{ var$temp=$； $body.append$temp； $temp.val$element.text.select； 文件副本； $temp.remove； } $FailCopy.clickfunction{ 警报做得好！div错误详细信息已复制到您的剪贴板，现在将其粘贴到记事本或电子邮件中！； }; Div错误详细信息：我要复制到剪贴板的文本： 姓名：TestName:testEmail:test@gmail.comAddress：testCity:testCountry:nullAd类别：testPlan:nullAd网站：公司名称：testΜήνμα：test

---

将div复制到剪贴板您的代码可能运行良好，但记事本无法处理Unix'\n换行符，它只能处理\r\n换行符，这就是您无法看到它们的原因

请下载更高级的编辑器，如Notepad++，并尝试将其粘贴到那里。不仅如此，它还有很多其他非常酷的功能，比如语法高亮显示、宏和插件，所以它值得用于更多的用途

如果要在MS应用程序中使用换行符，则需要在复制前使用以下换行符替换换行符：

$temp = $temp.replace(/\n/g, "\r\n");

要以HTML打印，您需要将\n替换为，如下所示：

$temp = $temp.replace(/\n/g, "<br>");

---

您对代码有一些问题

代码中的第一个问题是$element.textjquery文本从html中删除代码，包括标记。因此，剪贴板文本中没有换行符，因为所有html换行符都被剥离。。所以没有什么可以替代的

如果您想保留为换行符，您需要使用.html并更手动地解析文本

第二个问题是使用标记。标签只有一行，所以里面不能有换行符。您需要为转换使用

最后一个问题如上所述，您也应该为windows用户使用\r\n

我用可用版本更新了您的代码段

函数copyToClipboardelement{ var$temp=$； var brRegex=//gi； $body.append$temp； $temp.val$element.html.replacebrRegex\r\n.select； 文件副本； $temp.remove； } $FailCopy.clickfunction{ 警报做得好！div错误详细信息已复制到您的剪贴板，现在将其粘贴到记事本或电子邮件中！； }; Div错误详细信息：我要复制到剪贴板的文本： 姓名：TestName:testEmail:test@gmail.comAddress：testCity:testCountry:nullAd类别：testPlan:nullAd网站：公司名称：testΜήνμα：test 将div复制到剪贴板有两个问题：

1根据jquery文档：

.text方法的结果是一个字符串，包含所有匹配元素的组合文本。由于不同浏览器中HTML解析器的不同，返回的文本可能在换行符和其他空白处有所不同

以及他们的榜样,

<div class="demo-container">
    <div class="demo-box">Demonstration Box</div>
    <ul>
        <li>list item 1</li>
        <li>list <strong>item</strong> 2</li>
    </ul>
</div>

Div错误详细信息：我要复制到剪贴板的文本： 姓名：TestName:testEmail:test@gmail.comAddress：testCity:testCountry:nullAd类别：testPlan:nullAd网站：公司名称：testΜήνμα：test 将div复制到剪贴板非jQuery解决方案，只需将带换行符的字符串复制到剪贴板

为了清楚起见，请参考代码注释

---

可能的副本实际上，我想在Microsoft outlook windows 10应用程序中复制。同样的事情没有换行符我是这样用javascript打印文本的：$error-details.htmlName:'+onoma++我应该把它放在哪里\r\n？我在函数中添加了这一行，但我得到了以下错误消息：Uncaught TypeError:$temp.replace不是一个函数，如果它对您有效，请随意使用解决方案将我的代码片段复制到您的答案中我尝试了在控制台中执行以下操作并正常工作：var$temp=abcd\nabcd$temp=$temp.replace/\n/g\r\n；console.log$temp；//=>xiao\r\n cd您的答案只解决了问题的一小部分。修复此小错误时效果很好；parentElement.appendChildtextarea；=>parentElement.appendChildmyFluffyTextarea；谢谢你找到了那个鬼鬼祟祟的小虫子，我会马上把它压扁的

function copyStringWithNewLineToClipBoard(stringWithNewLines){

    // Step 1: create a textarea element.
    // It is capable of holding linebreaks (newlines) unlike "input" element
    const myFluffyTextarea = document.createElement('textarea');
    
    // Step 2: Store your string in innerHTML of myFluffyTextarea element        
    myFluffyTextarea.innerHTML = stringWithNewLines;
    
    // Step3: find an id element within the body to append your myFluffyTextarea there temporarily
    const parentElement = document.getElementById('any-id-within-any-body-element');
    parentElement.appendChild(myFluffyTextarea);
    
    // Step 4: Simulate selection of your text from myFluffyTextarea programmatically 
    myFluffyTextarea.select();
    
    // Step 5: simulate copy command (ctrl+c)
    // now your string with newlines should be copied to your clipboard 
    document.execCommand('copy');

    // Step 6: Now you can get rid of your fluffy textarea element
    parentElement.removeChild(myFluffyTextarea);
    }