js--选中文字复制到剪贴板上

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>点击按钮时将选中文字复制</title>
</head>
<body>
    <h2>我是H2标签</h2>
    <input type="button" onclick="copy()" value="点击后复制鼠标左键选中的文字">
    <input type="text" placeholder="ctrl + v或右键粘贴">
    <script>
        function copy(){
            document.execCommand("Copy"); 
        }
    </script>
</body>
</html>

 

转载于:https://www.cnblogs.com/webBlog-gqs/p/7173884.html

要在JavaScript中将文字复制剪切板,可以使用以下方法。首先,选择要复制的文本,这可以通过使用input元素的select()方法来实现。然后,使用document对象的execCommand('copy')方法将选中的文本复制剪切板中。例如,在示例中,我们可以通过以下方式复制文本到剪切板: const inputElement = document.querySelector('#input'); inputElement.select(); document.execCommand('copy'); 这段代码将选中id为"input"的输入框中的文本并复制剪切板中。 另外,还可以使用其他方法实现复制剪切板的功能。例如,可以使用第三方库如clipboard.js来简化复制的过程。在这种情况下,可以通过给按钮添加特定属性,并使用相应的JavaScript代码来实现复制剪切板的功能。例如,在示例中,可以使用以下方式复制文本到剪切板: <span class="btn-copy copy" @click="copyClipboard" data-clipboard-text="这里面是复制的内容,可以使用变量代替">点击复制</span> 通过点击按钮,执行copyClipboard函数来复制指定的文本到剪切板。 总结起来,要在JavaScript中复制文字剪切板,可以使用原生的execCommand('copy')方法或者使用第三方库实现。无论选择哪种方法,都需要先选中文本,然后调用相应的方法来完成复制的动作。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *3* [剪贴板操作 Clipboard API 教程](https://blog.csdn.net/liuhao9999/article/details/119318375)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *2* [js实现复制文字剪切板](https://blog.csdn.net/weixin_33923148/article/details/93282090)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值