js 复制粘贴

在JavaScript中，实现复制和粘贴功能通常涉及到与剪贴板的交互。以下是一些基础概念和相关信息：

基础概念

复制（Copy）：将选定的内容（如文本）复制到剪贴板，以便稍后粘贴到其他位置。

粘贴（Paste）：从剪贴板中取出之前复制的内容，并将其放置到当前指定的位置。

类型

文本复制粘贴：最常见，涉及纯文本内容。
文件复制粘贴：在某些高级应用中，可以复制和粘贴文件。
图片/多媒体复制粘贴：在支持多媒体编辑的应用中，可以复制和粘贴图片等多媒体内容。

应用场景

表单填写：用户可以复制粘贴信息，快速完成表单。
数据整理：在数据处理或报告编制中，可以快速复制粘贴数据。
内容创作：在文本编辑、博客撰写等场景中，提高内容生产效率。

实现方法

文本复制

可以使用document.execCommand('copy')方法或者现代浏览器的Clipboard API来实现文本复制。

function copyTextToClipboard(text) {
    if (navigator.clipboard && navigator.clipboard.writeText) {
        // 使用现代Clipboard API
        navigator.clipboard.writeText(text).then(function() {
            console.log('Text copied to clipboard');
        }).catch(function(err) {
            console.error('Could not copy text: ', err);
        });
    } else {
        // 使用旧方法
        var textarea = document.createElement('textarea');
        textarea.value = text;
        document.body.appendChild(textarea);
        textarea.select();
        try {
            var successful = document.execCommand('copy');
            var msg = successful ? 'successful' : 'unsuccessful';
            console.log('Copying text command was ' + msg);
        } catch (err) {
            console.error('Unable to copy', err);
        }
        document.body.removeChild(textarea);
    }
}

文本粘贴

可以使用document.execCommand('paste')方法或者现代浏览器的Clipboard API来实现文本粘贴。

function pasteTextFromClipboard() {
    if (navigator.clipboard && navigator.clipboard.readText) {
        // 使用现代Clipboard API
        navigator.clipboard.readText().then(function(text) {
            console.log('Pasted text: ', text);
            // 处理粘贴的文本
        }).catch(function(err) {
            console.error('Could not paste text: ', err);
        });
    } else {
        // 使用旧方法（通常需要用户授权）
        var textarea = document.createElement('textarea');
        document.body.appendChild(textarea);
        textarea.focus();
        try {
            var successful = document.execCommand('paste');
            var msg = successful ? 'successful' : 'unsuccessful';
            console.log('Pasting text command was ' + msg);
            if (successful) {
                var pastedText = textarea.value;
                console.log('Pasted text: ', pastedText);
                // 处理粘贴的文本
            }
        } catch (err) {
            console.error('Unable to paste', err);
        }
        document.body.removeChild(textarea);
    }
}