js将文本复制到粘贴板

本文主要是介绍js将文本复制到粘贴板，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

js将文本复制到粘贴板

在web开发中为了方便用户操作，我们时常会遇到需要一键复制的情况，一下两种方法是介绍js中操作剪切版的相关方法。

采用input标签实现

这里生成一个input标签，再将传入方法的文本值赋值给我们生成的input,再将我们input的值赋值到剪切版中。需要注意的是这种方法是不会保存文本中的换行信息的。

  // 复制的方法这个方法不能保存换行付function copyText(text, callback) { // text: 要复制的内容， callback: 回调var tag = document.createElement('input');tag.setAttribute('id', 'cp_hgz_input');tag.value = text;document.getElementsByTagName('body')[0].appendChild(tag);document.getElementById('cp_hgz_input').select();document.execCommand('copy');document.getElementById('cp_hgz_input').remove();if (callback) { callback(text) }}//调用方法copyText('123456', function () { console.log('复制成功') })

采用textarea实现

这里生成一个textarea标签，再将传入方法的文本值赋值给我们生成的textarea,再将我们textarea的值赋值到剪切版中。这种方式会保留文本中的换行符需要注意的是这种方式需要做机型适配， iOS 下会自动唤起键盘，所以需要做特定处理。

 function copy(value, cb) {// 动态创建 textarea 标签const textarea = document.createElement('textarea')// 将该 textarea 设为 readonly 防止 iOS 下自动唤起键盘，同时将 textarea 移出可视区域textarea.readOnly = 'readonly'textarea.style.position = 'absolute'textarea.style.left = '-9999px'// 将要 copy 的值赋给 textarea 标签的 value 属性textarea.value = value// 将 textarea 插入到 body 中document.body.appendChild(textarea)// 选中值并复制textarea.select()textarea.setSelectionRange(0, textarea.value.length)document.execCommand('Copy')document.body.removeChild(textarea)if (cb && Object.prototype.toString.call(cb) === '[object Function]') {cb()}}

这篇关于js将文本复制到粘贴板的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---