前端JS实现简易一键复制黏贴函数(可复制换行)

news/2024/7/19 13:40:32 标签: js, 前端, javascript

废话不多说, 直接上代码, 有问题下面或者私信讨论哈

定义

function copy(copyContent) {
    // 1. 创建并添加一个输入框元素(最后会销毁)
    const textareaEle = document.createElement("textarea");
    document.body.appendChild(textareaEle);
    // 2. 将需要复制的文本传入输入框, 并调用 select 方法, 选中输入框中文本
    textareaEle.value = copyContent;
	textareaEle.select();
    textareaEle.readOnly = 'readOnly';
    // 3. 调用复制选中文本的方法
    document.execCommand('copy');
    // 4. 销毁输入框
    document.body.removeChild(textareaEle);
}

使用

copy("我马上会到你的剪贴板里嘿嘿")

http://www.niftyadmin.cn/n/875391.html

相关文章

小程序使用 canvas 给图片添加水印

小程序使用 canvas 给图片添加水印 操作 canvas 相关的 api 使用的是微信最新提供的 (一路过来踩了好多坑…) 浅用微信小程序 canvas 给图片添加简单水印, 废话不多说, 先上效果, 后看代码 (uniapp等框架写法大同小异) 效果图 代码部分 (没有细分拆开来讲, 但大部分代码都加解…

微信小程序常见网络请求失败问题总结及解决方案

微信小程序常见网络请求失败问题总结及解决方案 微信开发者工具中未勾选不校验合法域名设置 未勾选这个设置在任何环境下发送http网络请求会失败 发送的是https请求,但网络请求依旧是失败 需要到官方的微信小程序后台的 开发管理 -> 开发设置 -> 服务器域…

uni-app一键复制到剪切板,无需插件

<template><text click"copyBtn()">复制</text> </template> export default{methods:{copyBtn: function() {uni.setClipboardData({data: 需要复制的内容 ,success: function () {uni.showToast({title: 复制成功,});},fail:function () …

前端实习总结

菜鸟自述 还是感叹一下时间的飞逝&#xff0c;大学一直在寻找&#xff0c;自己将来到底要干嘛&#xff1f;好在虽然学校老师教得不多&#xff0c;安排的项目到是挺多&#xff0c;做过不同类型的项目&#xff0c;做过pc端网站&#xff0c;pe端网站&#xff0c;其实也是&#xf…

自定义浏览器滚动条样式

//滑槽样式 .leftBox::-webkit-scrollbar {width: 6px;background: #DDF0FF;border-radius: 6px;padding-bottom: 5px; } //滑块样式 .leftBox::-webkit-scrollbar-thumb {background: #3D93FD;border-radius: 6px; }

前端将后台传的文件流下载为文件到本地

后台将excel文件解析为流的形式返给前端&#xff0c;前端拿到数据完成下载。利用XMLHttpRequest&#xff0c;具体代码实现如下&#xff1a; var oReq new XMLHttpRequest(); //url参数为拿后台数据的接口 oReq.open("POST",url, true); oReq.responseType "b…

openlayers在加载百度地图的基础上加要素图层

注意&#xff1a; 这个方法是openlayers加载百度的在线服务瓦片图层&#xff0c;openlayers加载百度地图坐标会有偏差&#xff0c;引入一个坐标转换源文件即可&#xff0c;这种方法可以将偏差降低最小&#xff0c;文件内容参照https://blog.csdn.net/du_5pet/article/details/…

openlayers结合百度地图API加载搜索定位功能

//每次请求之前清空上一次搜索的图层 searchPlaceLayer.getSource().clear()$.ajax({//url中的参数含义参见百度地图官网webAPI文档url: http://api.map.baidu.com/place/v2/search?query大唐芙蓉园&region西安市&page_size40&page_num0&outputjson&ak你…