动态提示(复制弹窗)提示框代码[子比主题美化教程]

image

在网页设计中,复制弹窗提示通常用于以下场景:

1. 文本复制:当用户尝试复制网页上的文本时,一个弹窗可能会出现,确认文本已成功复制到剪贴板,或者提醒用户复制操作因为某些原因未能成功完成(例如,文本含有无法复制的格式)。

2. 链接复制:在社交媒体、论坛或其他网站中,当用户复制链接时,弹窗提示可以告知链接已被复制,或者提供缩短链接等服务。

将以下代码放到子比主题后台设置-自定义代码-自定义底部HTML代码中

<!--复制提示开始-->
    <script src="https://cdn.bootcss.com/toastr.js/2.1.4/toastr.min.js"></script>
    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/toastr.js/2.1.4/toastr.min.css"/>
    <script type="text/javascript">
    function copy_remind() {
        toastr.success("撰文不易,若要转载请务必保留原文链接,谢谢您!", "复制成功!");
        clear_toastr(1600);
        // 动态设置消息提示时间
        function clear_toastr(time) {
            setTimeout(
            function() {
                toastr.clear();
            }, time);
        }
    }
    document.addEventListener("copy", function(e) {
        if (window.getSelection(0).toString()) {
            copy_remind(); //若所选文本不为空则显示
        }
        else {
            toastr.info("啊噢...你没还没选择复制的内容呢!", "复制提示");
        }
    });
    </script>
    <!--复制提示结束 -->
© 版权声明
THE END
分享