首页 > 技术文章 > Angular js 复制粘贴

yangsirc 2017-12-14 17:21 原文

关于copy到剪切板的实现需要引用Clipboard.min.js

https://pan.baidu.com/s/1eStTJlo

 

页面如下所示,需要实现 点击copy字样 将id为content的内容复制到剪切板中的功能

<div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title" id="myModalLabel">
                            Daily Reprot
                        </h4>
                            
                            <a  id="btn" style="float:right;padding-right:15px" data-clipboard-action="copy" data-clipboard-target="#content">
                                <i style="font-size:small" class="glyphicon glyphicon-file"></i>
                                <span style="font-size:small">Copy</span>
                            </a>
                    </div>
                    <div id="content"class="modal-body"> 

                    </div> 
</div>


在js中填加如下代码,并设置拷贝成功提示

var clipboard = new Clipboard('#btn');

        clipboard.on('success', function (e) {
            layer.msg("Copy successfully,you can paste to email directly!");
            console.log(e);
        });

        clipboard.on('error', function (e) {
            console.log(e);
        });

 

在IE中会提示 Allow Access 点击yes即可

 

推荐阅读