clipboardjs复制到粘贴板

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
<%--    <script src="<%=Config.GetJSAndCss("jquery-1.6.1.min.js") %>" type="text/javascript"></script>--%>
    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script>
</head>
<body>
    <!-- Target -->
    <input id="foo" value="http://testwww.doresuwe.com/four-years/treasure-hunt-game/"  readonly="readonly" style="background:#CCCCCC"/>

    <!-- Trigger -->
    <button class="btn" data-clipboard-target="#foo">
        <img src="https://clipboardjs.com/assets/images/clippy.svg" alt="Copy to clipboard" width="50" height="50" />
    </button>
</body>
</html>
<script>
    $(function () {
        var clipboard = new ClipboardJS('.btn');
        clipboard.on('success', function (e) {
            alert("copy成功!Copy的内容是:" + e.text);
            console.info('Action:', e.action);
            console.info('Text:', e.text);
            console.info('Trigger:', e.trigger);
            e.clearSelection();
        });
        clipboard.on('error', function (e) {
            alert("当前环境不支持复制到粘贴板,请手动复制,蟹蟹٩('ω')و");
            console.error('Action:', e.action);
            console.error('Trigger:', e.trigger);
        });
    })
</script>

 

posted @ 2019-01-21 14:10  顾星河  阅读(873)  评论(0编辑  收藏  举报