使用Clipboard API 的writeText 方法可複製文本到剪貼板，需在安全上下文和用戶交互中調(diào)用，支持現(xiàn)代瀏覽器，舊版可用execCommand 降級(jí)處理。
To copy text to the clipboard in JavaScript, you can use the Clipboard API , specifically the navigator.clipboard.writeText() method. This is the modern and recommended approach.
Using the Clipboard API (Modern Method)
This method is asynchronous and returns a Promise. It works in most modern browsers but requires a secure context (HTTPS or localhost).
navigator.clipboard.writeText("Hello, world!").then(() => { console.log("Text copied to clipboard"); }).catch(err => { console.error("Failed to copy: ", err); });Because it returns a Promise, you can also use async/await :
async function copyText(text) { try { await navigator.clipboard.writeText(text); console.log("Copied!"); } catch (err) { console.error("Copy failed: ", err); } }Handling User Gesture Requirement
Browsers require clipboard access to be triggered by a user action, like a button click. You can attach the copy function to a click event:
document.getElementById("copyBtn").addEventListener("click", () => { navigator.clipboard.writeText("Text to copy").then(() => { alert("Copied!"); }).catch(err => { alert("Failed: " err); }); });Fallback for Older Browsers
For older browsers that don't support the Clipboard API, you can use document.execCommand('copy') (deprecated but still functional in some environments).
Steps:
- Create a temporary
<textarea></textarea>element - Set its value to the text you want to copy
- Append it to the DOM and select its content
- Run
document.execCommand('copy') - Remove the temporary element
Check for navigator.clipboard support first, then fall back if needed:
Basically just use the Clipboard API when possible, and provide a fallback only if you need to support older environments. Keep in mind permissions and user interaction requirements.
以上是如何將文本複製到JavaScript中的剪貼板？的詳細(xì)內(nèi)容。更多資訊請(qǐng)關(guān)注PHP中文網(wǎng)其他相關(guān)文章！
熱AI工具
Undress AI Tool
免費(fèi)脫衣圖片
Undresser.AI Undress
人工智慧驅(qū)動(dòng)的應(yīng)用程序，用於創(chuàng)建逼真的裸體照片
AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。
Stock Market GPT
人工智慧支援投資研究，做出更明智的決策
熱門文章
熱工具
記事本++7.3.1
好用且免費(fèi)的程式碼編輯器
SublimeText3漢化版
中文版，非常好用
禪工作室 13.0.1
強(qiáng)大的PHP整合開發(fā)環(huán)境
Dreamweaver CS6
視覺化網(wǎng)頁開發(fā)工具
SublimeText3 Mac版
神級(jí)程式碼編輯軟體(SublimeText3)
如何解決 Windows + Shift + S 無法正常使用的問題？
May 08, 2023 pm 07:16 PM
檢查你的鍵盤如果鍵盤快速鍵不起作用，鍵盤本身可能有問題。確保它已正確插入並被您的PC識(shí)別。有筆記型電腦鍵盤給您帶來麻煩嗎？如果您有一個(gè)額外的鍵盤，請(qǐng)將其插入並查看它是否有效。如果是這樣，那可能是鍵盤本身的問題。使用無線鍵盤？按照製造商的說明重新配對(duì)。您還應(yīng)該檢查任何電纜是否損壞，確保按鍵沒有碎屑，然後適當(dāng)按下。有關(guān)更多信息，請(qǐng)查看Windows11鍵盤損壞的這些修復(fù)。使用列印螢?zāi)绘I如果您迫切需要螢?zāi)唤貓D並且沒有時(shí)間進(jìn)行故障排除，您可以先使用解決方法。要獲得桌面的完整照片，請(qǐng)點(diǎn)擊
如何解決 Windows 11 複製貼上功能無回應(yīng)的問題？
Apr 26, 2023 pm 08:55 PM
複製一直是保存和共享文件的好方法。它允許您創(chuàng)建手動(dòng)備份、執(zhí)行簡(jiǎn)單的傳輸，甚至是如果不複製可能會(huì)損壞原始檔案的修改。但是，如果您在嘗試使用WindowsPC上的剪貼簿時(shí)遇到問題，這有時(shí)會(huì)很困難。一些Windows11用戶最近無法在他們的系統(tǒng)上使用複製貼上。由於多種原因，可能會(huì)出現(xiàn)此問題，如果您在同一條船上，那麼您可以在PC上修復(fù)它。如何修復(fù)Windows11上的複製貼上由於許多問題可能導(dǎo)致Windows上的複製貼上故障，我們?cè)谙旅媪谐隽私鉀Q此問題的最常見解決方案。我們建議您從第一
iPhone上的剪貼簿：如何存取它？
May 16, 2023 am 10:46 AM
iPhone上的剪貼簿在哪裡？由於iOS是一個(gè)封閉的生態(tài)系統(tǒng)，剪貼簿是儲(chǔ)存在虛擬記憶體中的內(nèi)部功能。預(yù)設(shè)情況下，使用者無法查看剪貼簿內(nèi)容或以任何方式編輯。但是，有一些方法可以在iPhone上存取剪貼簿。您可以將剪貼簿貼上到Notes應(yīng)用程式（或任何其他文字編輯器）中，並在其中保留剪貼簿的多個(gè)副本，並根據(jù)需要進(jìn)行編輯?；蛘?，您可以使用「快速指令」App建立用於顯示剪貼簿的捷徑。最後，您可以使用第三方應(yīng)用程序，例如貼上。如何在iPhone上存取剪貼簿？無論您喜歡使用內(nèi)建的「?jìng)渫洝箲?yīng)用程式、
如何在Mac上查看剪貼簿歷史記錄
Sep 14, 2023 pm 12:09 PM
從「訪問」查看macOS剪貼簿歷史記錄當(dāng)您在Mac上複製任何內(nèi)容（文本，圖像，文件，URL等）時(shí)，它會(huì)進(jìn)入「剪貼簿」。以下是查看Mac上上次複製的內(nèi)容的方法。轉(zhuǎn)到Finder，然後點(diǎn)擊選單列中的“編輯”點(diǎn)擊“顯示剪貼簿”這將打開一個(gè)窗口，顯示macOS剪貼簿的內(nèi)容。在Mac中取得包含多個(gè)項(xiàng)目的剪貼簿歷史記錄當(dāng)然，本機(jī)Mac剪貼簿歷史記錄並不是您可以擁有的最通用的工具。它只顯示您複製的最後內(nèi)容，因此，如果您希望一次複製多個(gè)內(nèi)容，然後將它們?nèi)抠N上在一起，那麼您根本無法做到這一點(diǎn)。但是，如果您正在尋找
截圖和截圖在 Windows 11/10 上的位置
May 16, 2023 pm 04:01 PM
Windows11中的剪輯和螢?zāi)唤貓D在哪裡？這是我們從一些可能剛安裝新作業(yè)系統(tǒng)或第一次使用截圖工具的讀者那裡得到的問題。該工具旨在截取電腦螢?zāi)坏娜魏位蛩胁糠?。為了將事情放在上下文中，PrintScreen鍵將拍攝您的螢?zāi)坏耐暾煺?，但SnippingTool可調(diào)整為僅抓取您喜歡的區(qū)域。 Windows10/11上的截圖和螢?zāi)唤貓D在哪裡？預(yù)設(shè)情況下，剪輯和螢?zāi)唤貓D儲(chǔ)存到電腦的剪貼簿。這意味著要檢索它們，您只需將它們貼上到您想要的應(yīng)用程式中，例如MicrosoftPaint、Photo
如何在 Windows 11 上使用剪貼簿歷史記錄
Apr 19, 2023 pm 12:13 PM
<h2>在Windows11上使用剪貼簿歷史記錄</h2><p>您仍然可以使用<strong>右鍵點(diǎn)擊>複製</strong><strong>右鍵單擊>貼上</strong>或使用<strong>Ctrl+C</strong&
Windows 11 截圖工具可獲得螢?zāi)唤貓D的自動(dòng)儲(chǔ)存功能
May 14, 2023 am 10:07 AM
您不再需要手動(dòng)儲(chǔ)存使用Windows11中的截圖工具擷取的截圖。除了被複製到剪貼簿之外，它們還將以PNG格式自動(dòng)保存在應(yīng)用程式版本11.2209.2.0中「我的圖片」下的「截圖」資料夾中向前。以下是您可以啟用或停用此行為的方法。 Windows11中的截圖工具到目前為止，使用截圖工具，當(dāng)您使用快捷鍵Win+Shift+S並擷取截圖時(shí)。它將自動(dòng)複製到剪貼簿，您可以將其貼到Paint或其他圖像編輯器中，或者您可以打開SnippingTool進(jìn)行標(biāo)記和共享。但是，該應(yīng)用程式嚴(yán)重缺乏自動(dòng)儲(chǔ)存功能
在 Android 和 Windows 平臺(tái)之間複製和貼上文字的方法
Apr 25, 2023 pm 10:43 PM
在Android和Windows11之間複製和貼上文字注意：對(duì)於本文，我們使用的是Windows11，但這個(gè)過程在Windows10上幾乎相同。首先，您需要啟用剪貼簿歷史記錄功能（如果尚未啟用）。您可以使用以下步驟啟用它：按一下「開始」或按Windows鍵以啟動(dòng)「開始」功能表並按一下「設(shè)定」。當(dāng)設(shè)定開啟時(shí)，點(diǎn)擊左側(cè)的系統(tǒng)。向下捲動(dòng)到右側(cè)列表，然後從選單中選擇剪貼簿選項(xiàng)。切換剪貼簿歷史選項(xiàng)On。在同一部分中，啟用跨裝置同步並選擇自動(dòng)同步我複製的文字。在Android上安裝Microsof
