Question

我使用floowing javascript来复制网页上所有（多个）code元素的文字：

<p id="p1">Copy all code</p>

<button onclick="copyToClipboard('code')">Copy TEXT 1</button>

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

这很有用，因为如果页面上有很多代码段，并且您想要所有这些代码段，则不必逐个复制它们。但是，将用空行复制的代码分开会很好。

例如，如果我有：

<code>This is code snippet 1
</code>

<code>This is code snippet 2
</code>

以下内容将被复制到剪贴板：

This is code snippet 1This is code snippet 2

我需要的是代码之间的换行：

This is code snippet 1
This is code snippet 2

正如您可能猜到的那样，我希望在不改变code代码段内容的情况下这样做。

Answer 1

如果要使用多行字符串，请使用<textarea>代替<input>。重复：Copy

Answer 2

假设<code>的不同部分可以在文档中的任何位置......
这是我最终得到的代码：

＆＃13;

function copyToClipboard(element) {
  var $temp = $("<textarea>");
  $("body").append($temp);
  
  var test = "";
  $(element).each(function(index, item){
    if(index > 0){
      test = test + "\n";
    }
    test = test + item.innerHTML;
  });
  
  console.log(test);
  $temp.val(test).select();
  document.execCommand("copy");
  $temp.remove();
}

＆＃13;

code{
  display: block;
  border: 1px solid gray;
  margin: 4px 0;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<code>This is code snippet 1</code>
<code>This is code snippet 2</code>
<button onclick="copyToClipboard('code')">Copy all code</button>

＆＃13;

希望它有所帮助。

需要一种在copyToClipboard中添加换行符的方法

2 个答案: