js实现点击copy，可兼容

最新推荐文章于 2024-02-03 11:06:24 发布

SavourHumord

最新推荐文章于 2024-02-03 11:06:24 发布

阅读量1.5k

点赞数 1

分类专栏：前端功能性代码块（demo）文章标签： javascript Copy

本文链接：https://blog.csdn.net/wu1ming1you1shi/article/details/73603542

版权

前端功能性代码块（demo）专栏收录该内容

3 篇文章 0 订阅

订阅专栏

　　在实现功能时写的一个小demo，可以实现点击复制内容（任何你需要copy的文字内容data）。

　　经测试，可兼容 chrome, edge, firefox, ie, opera, safari，至于版本的话肯定是有限制的，你可以尝试一下版本的底线。

　　下面就是demo，你可以使用在任何地方。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>js实现copy</title>
</head>
<body>
    <div>
        <span>阳光总在风雨后。</span>
    </div>
    <input type="text" name="" placeholder="请粘贴测试">
<script type="text/javascript">
    (function(){
        var span = document.getElementsByTagName('span')[0];
        span.addEventListener('click', function(event){
            var t, p, i;
            t = event.target || event.srcElement;
            p = t.parentNode;
            i = document.createElement('input');
            i.width = 0;
            i.height = 0;
            i.value = t.innerText;
            p.appendChild(i);
            i.focus();
            i.setSelectionRange(0, i.value.length);
            document.execCommand('copy', true);
            p.removeChild(i);
        },false);
    })();
</script>
</body>
</html>

哦，对了，如果是IE的话，你应该用IE的事件处理程序attachEvent。

　　谢谢你的浏览，如果觉得不错，请点赞TT。