从行数据复制到 JavaScript 中的剪贴板

Question

function copyPaste(number) {
        /* Get the text field */
      var copyText = number;

      /* Select the text field */
      copyText.select();
      copyText.setSelectionRange(0, 99999); /* For mobile devices */

      /* Copy the text inside the text field */
      document.execCommand("copy");

      /* Alert the copied text */
      alert("Copied the text: " + copyText);
    }

<th><p id="phone" onclick="copyPaste(<?php echo $row['phone'];?>)"><?php echo $row['phone']; ?></p></th>

我在没有<p> 标签的情况下工作。它也不起作用..错误：来自控制台的Uncaught TypeError: copyText.select is not a function at copyPaste ((index):109) at HTMLParagraphElement.onclick。我在关注the course

Answer 1

select() 是HTMLInputElement 的一个方法。目前，copyText 是一个字符串。要使用copy 命令，您需要在 Html 中创建虚拟输入。

function copyPaste(number) {
  var dummy = document.createElement("input");

  // Add it to the document
  document.body.appendChild(dummy);

  // Set value of input 
  dummy.value = number;

  /* Select the text field */
  dummy.select();
  dummy.setSelectionRange(0, 99999); /* For mobile devices */

  /* Copy the text inside the text field */
  document.execCommand("copy");

  // Remove it as its not needed anymore
  document.body.removeChild(dummy);

  /* Alert the copied text */
  alert("Copied the text: " + number);
}

Answer 2

您的代码看起来像是在尝试复制一个数字，但是 w3 教程中的 copyPaste() 函数是用一个元素调用的。如果您想复制文本，navigator.clipboard.writeText() (MDN link) 是您的朋友。这就是你使用它的方式：

function copyPaste(number) {
  navigator.clipboard.writeText(number)
  alert(`The Number ${number} was copied.`)
}

编辑：代码不能在 JS 控制台中运行，因为页面需要处于焦点位置。如果你在网页上实现它，它应该可以工作。