如何在 JavaScript 中有效率地將文字複製到剪貼簿？

在 JavaScript 複製到剪貼簿

概述

要在 JavaScript中將文字複製到剪貼簿，有以下三種方法鑰匙API：

1. 非同步剪貼簿API (navigator.clipboard.writeText)：

   • Chrome 66 及更高版本的主要API（2018 年3 月） ).
   • 使用 JavaScript Promises 進行非同步訪問，確保流暢的使用者體驗。
   • 可以直接從變數複製文字。
   • 需要HTTPS 才能存取

2. document.execCommand('copy'):

   已
   • 已
   已
   • 已
   已
   • 已
   已
   • 已
   已
   已
已
3. 已棄用，但廣受支持。

   同步訪問，停止 JavaScript 執行，直到複製完成完成。

   從 DOM 讀取文字並將其放置在剪貼板上。
   • 在控制台測試期間可能會顯示安全提示。

覆蓋副本事件：

允許透過任何複製事件修改剪貼簿資料。

• 支援純文字以外的多種資料格式。

發展注意

剪貼簿相關指令可能無法在控制台測試中運作。通常需要頁面互動或活動標籤。

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

由於瀏覽器棄用 IFRAME 中的跨網域權限，嵌入式示範可能無法在 Chrome 和 Microsoft Edge 等瀏覽器中運作。 Async Plus Fallback將非同步剪貼簿API 與後備結合document.execCommand('copy') 確保廣泛的瀏覽器支援：

以上是如何在 JavaScript 中有效率地將文字複製到剪貼簿？的詳細內容。更多資訊請關注PHP中文網其他相關文章！