Ninext

剪贴板示例

图片.png

本示例演示如何把文本复制到剪贴板。它取自 Ninext 示例应用中的 Copy / Paste data 示例。

function copyToClipboard(text : text) do
 #{:text navigator.clipboard.writeText(text);}#
end;

navigator.clipboard.writeText() 的使用限制

navigator.clipboard.writeText(text) 这个 API 受到浏览器强制执行的安全限制。它必须由用户交互（例如点击按钮）直接触发。

如果在用户交互与调用 writeText() 之间出现延迟或中间处理（例如某项计算），浏览器就不再认为该操作是由用户发起的，会阻止访问剪贴板以防滥用。

最佳实践：

  • 直接在用户事件处理程序（例如 onclick）中调用 navigator.clipboard.writeText(text)。
  • 避免在用户操作与函数调用之间引入异步操作或延迟。

正确示例：

document.getElementById("copyButton").addEventListener("click", () => {
    navigator.clipboard.writeText("Copied text!")
        .then(() => console.log("Text copied successfully!"))
        .catch(err => console.error("Error copying text:", err));
});

错误示例（可能无法工作）：

document.getElementById("copyButton").addEventListener("click", () => {
    setTimeout(() => { // Introducing a delay may prevent copying
        navigator.clipboard.writeText("Copied text!");
    }, 100);
});