如何使用 HTML 按钮将变量值复制到剪贴板？

Question

我正在创建一个视频内容搜索网站。在结果中，我希望有一个按钮，可以将数据库中的视频名称和视频 URL 复制到剪贴板。 我找到了一个 JS 函数，可以复制设置的文本（下面代码中的“复制文本”）。我需要该函数来复制变量（从数组），该变量会发生变化，具体取决于某人正在搜索的内容。

<button onclick="myFunction()">Copy Video Name & URL</button>

function myFunction() {
    var copyText = "Copied text";
    let input = document.createElement('input');
    input.setAttribute('type', 'text');
    input.value = copyText;
    document.body.appendChild(input);
    input.select();
    document.execCommand("copy");
    document.body.removeChild(input)
} 

Answer 1

enter code here  const handleCopy = (copyText) => {
const textToCopy = copyText;

if (navigator.clipboard) {
  navigator.clipboard
    .writeText(textToCopy)
    .then(() => setCopiedIndex(index))
    .catch((error) => {
      /*    console.error(
        "Error copying to clipboard using Clipboard API:",
        error
      ); */
      fallbackCopyToClipboard(textToCopy, index);
    });
} else {
  fallbackCopyToClipboard(textToCopy, index); 

  }
};

enter code here const fallbackCopyToClipboard = (textToCopy, index) => {
const textarea = document.createElement("textarea");
textarea.value = textToCopy;
textarea.style.position = "fixed";
document.body.appendChild(textarea);

textarea.select();
document.execCommand("copy");

document.body.removeChild(textarea);

setCopiedIndex(index);

};