为什么我的代码无法处理或接受换行符？ [复制]答案

【问题标题】：Why is my code unable to process or accept line breaks? [duplicate]为什么我的代码无法处理或接受换行符？ [复制]
【发布时间】：2020-04-01 16:07:06
【问题描述】：

我是编程新手，我正在构建它以帮助我复制粘贴常见笔记和内容，这是我在工作中必须做的很多事情。请在此处查看程序 https://jsbin.com/ruvodipomi/edit?html,js,output

<html>
<button onclick="copyToClipboard('#p1')">Hello</button><br>

   <p id="p1">Hello<br> World</p>

   <textarea cols="80" rows="25"></textarea>

</html>

<script>

function copyToClipboard(element) {
  var $temp = $("<input>");
  $("body").append($temp);
  $temp.val($(element).text()).select();
  document.execCommand("copy");
  $temp.remove();
}

</script>

因此，如果您单击“Hello”按钮，它会将“Hello World”保存在剪贴板中。通过这种方式，我可以制作包含多个笔记的多个按钮，这将使我的工作更轻松，而不是从某个文档中复制它们。

问题是，我无法在元素中换行例如而不是在剪贴板中保存“Hello World”，我要保存
'你好
世界'
但是我无法使用<br> <br /> <\n>
程序处理中断或至少通过标签接受它们是非常重要的。

我相信它与Java函数有关？但我没听懂。

你能看一下吗？非常感谢^^

【问题讨论】：

这能回答你的问题吗？ How to keep line breaks when using .text() method for jQuery?
这能回答你的问题吗？ Copy to clipboard with break line
$("<input>") 将删除新行，因此请使用 $("<textarea>")

标签： javascript html onclick copy

【解决方案1】：

获取html() 的p 标签

将所有<br> 替换为\n

创建textarea 并复制：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button onclick="copyToClipboard('#p1')">Hello</button><br>

   <p id="p1">Hello<br> World</p>

   <textarea cols="80" rows="25"></textarea>


<script>

function copyToClipboard(element) {
  var $temp = $("<textarea>");
  $("body").append($temp);
  $temp.val($(element).html().toString().replace(/\<br\>/gi,"\n")).select();
  document.execCommand("copy");
  $temp.remove();
}

</script>

【讨论】：

太棒了！我找不到这个好几个星期了！太感谢了。我一定会阅读更多关于此的内容。