document.execCommand("Copy") 不复制 [英] document.execCommand("Copy") not copying

问题描述

我正在使用 jquery 使用户能够单击按钮复制折扣代码.出于某种原因， document.execCommand("Copy"); 根本不起作用.当我 ctrl + v 粘贴时，什么也没有复制过来.有人可以帮我吗?谢谢！！

$(document).ready(function(){$('#copyBtn').click(function(){console.log("加载")var copyText = $('#discountCode');console.log($('#discountCode').text())copyText.select();document.execCommand("复制");alert("复制文本:" + copyText.text());})});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script><p>使用以下代码可获得 20% 的注册费折扣:<strong><span id="discountCode">FKR2455EMSPN</span></strong></p><p>要注册，您将被带到SuperReturn 网站.</p><p>点击<button id="copyBtn">这里</button>将我们的 VIP 代码复制到您的剪贴板</p><p>点击<a href='#'>这里现在被带到 SuperReturn 注册页面.</p>

解决方案

您缺少范围对象.

我在下面为您破解了代码并对其进行了评论，以便您可以确切地看到我所做的.

var text = $("#discountCode").get(0);//获取元素的节点var selection = window.getSelection();//获取选择对象var range = document.createRange();//创建一个新的范围range.selectNodeContents(text);//从第 1 行选择节点的内容selection.removeAllRanges();//删除所有旧范围selection.addRange(range);//将范围添加到选择中document.execCommand('copy');//执行命令

您的代码不起作用的原因是因为它没有突出显示您要复制的项目，因此您什么都不复制，并且当您什么都不复制时，您复制的最后一个值将被保留.

希望这会有所帮助.

$(document).ready(function(){$('#copyBtn').click(function(){var text = $("#discountCode").get(0)var selection = window.getSelection();var range = document.createRange();range.selectNodeContents(text);selection.removeAllRanges();selection.addRange(range);//添加到剪贴板.document.execCommand('copy');})});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script><p>使用以下代码可享受注册费 20% 的折扣:<strong><span id="discountCode">FKR2455EMSPN</span></strong></p><p>要注册，您将被带到SuperReturn 网站.</p><p>点击<button id="copyBtn">这里</button>将我们的 VIP 代码复制到您的剪贴板</p><p>点击<a href='#'>这里</a>现在被带到 SuperReturn 注册页面.

I am using jquery to enable a user to click on a button to copy a discount code. For some reason, document.execCommand("Copy"); is not working at all. When I ctrl + v to paste, nothing has gottten copied over. Could someone please help me? Thank you!!

$(document).ready(function(){
$('#copyBtn').click(function(){

  console.log("loaded")
  var copyText = $('#discountCode');
  console.log($('#discountCode').text())
  copyText.select();
  document.execCommand("Copy");
  alert("Copied the text: " + copyText.text());
})

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>


	<p>Receive 20% discount on registration fees using the code: <strong><span id="discountCode">FKR2455EMSPN</span></strong></p>

	<p>
To register, you will be taken to the
SuperReturn website.
</p>
<p>
Click <button id="copyBtn">here </button> to copy our VIP code to your clipboard
</p>
<p>
Click <a href='#'>
here</a> to now be taken to the SuperReturn registration page.
</p>
</div>

解决方案

You're missing the range object.

I have broken the code for you below and commented it so you can see exactly what I do.

var text = $("#discountCode").get(0); // Grab the node of the element

var selection = window.getSelection(); // Get the Selection object

var range = document.createRange(); // Create a new range

range.selectNodeContents(text); // Select the content of the node from line 1

selection.removeAllRanges(); // Delete any old ranges

selection.addRange(range); // Add the range to selection

document.execCommand('copy'); // Execute the command

The reason why your code does not work is because it does not highlight the item you are wanting to copy, so you copy nothing and when you copy nothing the last value you copied is preserved.

Hope this helps.

$(document).ready(function(){
    $('#copyBtn').click(function(){

        var text = $("#discountCode").get(0)
        var selection = window.getSelection();
        var range = document.createRange();
        range.selectNodeContents(text);
        selection.removeAllRanges();
        selection.addRange(range);
        //add to clipboard.
        document.execCommand('copy');
    })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>

<p>
  Receive 20% discount on registration fees using the code: 
  <strong><span id="discountCode">FKR2455EMSPN</span></strong>
</p>

<p>
  To register, you will be taken to the
  SuperReturn website.
</p>

<p>
  Click <button id="copyBtn">here </button> to copy our VIP code to your clipboard
</p>

<p>
  Click <a href='#'>here</a> to now be taken to the SuperReturn registration page.
</p>

这篇关于document.execCommand("Copy") 不复制的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！