html点击图片按钮自动复制文字到剪切板

admin2023-01-1876272

实现在手机浏览器上点击一张图片或者一个按钮,自动复制一段文字到剪切板中,一共有三步。

一、图片或者按钮添加js触发。

<img src="images/ewm.png" alt="" onClick="copyUrl2()"/> //单击图片触发copyUrl2()函数

二、写要复制进剪切板中的文字,并隐藏。

<p style="display:none;" cols="20" id="biao1">要复制的文字</p>

三、写copyUrl2()函数。

<script type="text/javascript">
    function copyUrl2()
        {
            var Url2=document.getElementById("biao1").innerText;
            var oInput = document.createElement('input');
            oInput.value = Url2;
            document.body.appendChild(oInput);
            oInput.select(); // 选择对象
            document.execCommand("Copy"); // 执行浏览器复制命令
            oInput.className = 'oInput';
            oInput.style.display='none';
            alert('您已成功复制公众号名【***】,请前往微信添加!');
        }
</script>

按上面三步操作即可实现功能。

网友评论当前共有2条评论

  • 2019-07-31 11:42:12

    作者,请问可以实现打开html网页,自动复制隐藏内容到剪切板吗

  • 2020-01-26 18:41:51

    成功了!
    感谢分享