本文介绍了一个简单的HTML和JavaScript代码示例，展示了如何在用户点击按钮时，获取输入框内的文本并使用`document.execCommand(copy)`将其复制到剪贴板，同时清空输入框内容并显示复制成功的提示。
效果
- 输入要粘贴的内容后，点击按钮可以进行复制到粘贴板
- 复制成功有相应的提示，同时清空文本框的内容
- 可以粘贴输入的内容
代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<input type="text" placeholder="请输入要粘贴的内容">
<button id="btn">点击复制</button>
<script>
const txt = document.querySelector('input[type="text"]')
const btn = document.getElementById('btn')
btn.addEventListener('click',() => {
const textarea = document.createElement('textarea')
textarea.value = txt.value
document.body.appendChild(textarea)
// select() 方法用于选择该元素中的文本(仅有选中文本功能)
textarea.select()
if(document.execCommand){
// document.execCommand('copy') 将当前选中区复制到剪贴板
document.execCommand('copy')
alert('复制成功')
}
document.body.removeChild(textarea)
txt.value = ''
})
</script>
</body>
</html>
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
