如何在不同瀏覽器中可靠地將文字複製到 JavaScript 中的剪貼簿？

在 JavaScript 複製到剪貼簿：多瀏覽器方法

將文字複製到剪貼簿涉及利用各種瀏覽器 API。本文重點介紹三種主要方法：

1.非同步剪貼簿API：[navigator.clipboard.writeText]
在Chrome 66 中發布，非同步剪貼簿API 提供對剪貼板的異步訪問。它使用 Promises，確保使用者提示不會中斷 JavaScript 執行。此方法需要 HTTPS 並支援 Chrome 66 中的非活動標籤。

2. document.execCommand('copy') （已棄用）
自2015 年起在大多數瀏覽器中可用，此方法是同步的，會阻止JavaScript 執行。它從 DOM 複製文字並將其放置在剪貼簿上。部分瀏覽器在此過程中可能會顯示權限提示。

3.覆蓋複製事件
這種進階技術可讓您根據複製事件修改剪貼簿上顯示的內容。這裡不涉及它，因為它不直接解決複製到剪貼簿的問題。

一般開發筆記

• 剪貼簿操作通常需要頁面處於活動狀態或需要使用者互動。
• 自 2020 年 2 月起，跨來源 IFRAME 和 IFRAME 沙盒可能會導致範例程式碼無法在某些瀏覽器中運作。

非同步回退方法

為了確保跨瀏覽器相容性，請考慮使用非同步回退方法對於舊版瀏覽器，到document.execCommand( 'copy')：

function copyTextToClipboard(text) {
  if (!navigator.clipboard) {
    fallbackCopyTextToClipboard(text);
    return;
  }
  navigator.clipboard.writeText(text).then(() => {
    console.log('Async: Copying to clipboard was successful!');
  }, (err) => {
    console.error('Async: Could not copy text: ', err);
  });
}

以上是如何在不同瀏覽器中可靠地將文字複製到 JavaScript 中的剪貼簿？的詳細內容。更多資訊請關注PHP中文網其他相關文章！