Question

我有以下代码，可通过单击按钮将文本复制到剪贴板。文本位于段落元素中。因此，我将该文本移到隐藏的输入字段中，然后复制到剪贴板。 但这仅在我将文本移至文本字段而非隐藏字段时有效。我也尝试display:none输入字段，但是结果是一样的。（因为空格很重要，所以我无法将其设置为visibility:hidden）。我该怎么解决？

$("button").on("click", function() {
  var n = $("p").text();
  n = $.trim(n);
  $(".copied").attr("value", n).select();
  document.execCommand("copy");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p>
This is the copied text!
</p>
<input type="hidden" class="copied"/>
<button>
COPY
</button>
<input type="text" placeholder="paste copied text here"/>

这是可编辑的jsfiddle：

http://jsfiddle.net/d9a4x6vc/

Answer 1

您可以尝试在选择然后将输入的类型更改为文本，然后再将其隐藏起来。

 0    1      2        3        4
-1    0   201704   201705   201706
 0    0    13.5     14.5     15.5
750   12    -1       -1       -1
760   9.6   12        0        0

$("button").on("click", function() {
  var n = $("#copyMe").text();
  $(".copied").attr("value", n);
  $(".copied").attr("type", "text").select();
  document.execCommand("copy")
  $(".copied").attr("type", "hidden")
});

Answer 2

最近我遇到了完全相同的问题。我所做的是将输入框的位置设置为绝对，然后将其移出屏幕。还要注意，即使输入字段的宽度也会影响结果。我试图将width和height设置为0，但之后也没有复制。

Answer 3

与DavidDomain explains in answer to a similar question一样，您需要更改输入属性以采用该值。

您可以尝试以下方法：

$("button").on("click", function() {
  var n = $("p").text();
  n = $.trim(n);
  $(".copied").css({
    position: "absolute",
    left: "-1000px",
    top: "-1000px"
  }).attr("value", n).attr("type","text").select();
  $(".copied").attr('css','').attr("type","hidden");
  document.execCommand("copy");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p>
This is the copied text!
</p>
<input type="hidden" class="copied"/>
<button>
COPY
</button>
<input type="text" placeholder="paste copied text here"/>

从隐藏的输入将文本复制到剪贴板在jQuery中不起作用

3 个答案: