js复制内容至剪切板并弹出toast

最新推荐文章于 2024-08-09 08:05:27 发布

lavendersue

最新推荐文章于 2024-08-09 08:05:27 发布

阅读量891

点赞数

分类专栏： js&jq 文章标签： js 复制粘贴 toast

本文链接：https://blog.csdn.net/lavendersue/article/details/80841264

版权

本文介绍了如何使用JavaScript实现将文本内容复制到剪切板，并在操作成功后弹出Toast提示。提供了适用于Android和iOS/Android的代码示例，包括HTML、CSS和JS部分。

摘要由CSDN通过智能技术生成

如今，无论是App亦或是PC，当存在复制操作时，相信每一个都不会自己动手进行输入。而，复制成功之后，如何将其复制在剪切板中，我们粘贴就可以。这个问题，如果不是今天存在这样的需求，估计小编自己都不会想到这么一个东西。虽然简单，但还是想贴出来，和大家分享下。代码献上：
1、Android
html:

<body style="font-size: 16px;">
    <div class="main">
        <div class="container">
            <span id="qq_num">12345678</span>
            <span id="copy">点击复制</span>                         
        </div>

        <div id="m-toast-pop" class="m-toast-pop">
            <div class="m-toast-inner">
                <div class="m-toast-inner-text" id="m-toast-inner-text">复制成功</div>
            </div>
        </div>
    </div>
</body>

css:

<style>
        #copy{
            color: #FE2C54;
            font-size: 0.8125em;
            margin-left: 0.75em;
        }

        .m-toast-pop {
            display: none;
            position: fixed;