js实现移动端粘贴板功能

最新推荐文章于 2024-06-16 17:45:08 发布

前端卡卡西呀

最新推荐文章于 2024-06-16 17:45:08 发布

阅读量1.9k

点赞数 2

分类专栏： Javascript

本文链接：https://blog.csdn.net/RedaTao/article/details/84064065

版权

Javascript 专栏收录该内容

48 篇文章 0 订阅

订阅专栏

借助document的execCommand方法实现

<input type="text" style="position: absolute; top: -10rem;" id="copyValue" value="测试粘贴板功能内容">
<input type="button" id="copyBtn" value="点击复制">

        var copyBtn = document.getElementById('copyBtn')
        copyBtn.onclick = function() {
            if(!document.execCommand) {
                alert('当前环境不支持复制功能');
                return;
            }
            var copyValue=document.getElementById("copyValue");
            copyValue.select(); // 选择对象
            document.execCommand("Copy"); // 执行浏览器复制命令
            alert("已复制好，可贴粘。");
        }

⚠️1. 首先要检查一下当前环境是否支持复制功能；

2.其次，此复制功能智能复制表单元素的内容，且该表单不能是type="hidden"和display：none，可将该元素定位到可见区域外。