js复制功能的有效方法总结

一,用js原生的document.execCommand()

function copy(){
var Url2=document.getElementById("xjh");
Url2.select();
try{
if(document.execCommand('copy', true, null)){
document.execCommand("Copy");
alert("已复制好,可贴粘。");
} else{
alert("复制失败,请手动复制");
}
} catch(err){
alert("复制失败,请手动复制");
}
}

兼容性:测试过,兼容IE8以上,谷歌43以上也支持。

二,用jquery插件


jquery.zclip.min.js的用法

jquery.zclip.min.js的作用可用jquery的插件:zclip解决js复制在不同浏览器的支持度。但是前提需要安装flash。

首先的引用jquery包  

//网上可以查找下载包
 
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.zclip.min.js"></script>   //导入jquery插件
 
$(function(){
    $('#copy_input').zclip({
        path: 'js/ZeroClipboard.swf',   //swf文件不能掉,注意:是下载的swf文件。
        copy: function(){//复制内容
            return $('#mytext').val();
        },
        afterCopy: function(){//复制成功
            $("<span id='msg'/>").insertAfter($('#copy_input')).text('复制成功');
        }
    });
});
如果是复制的内容来自输入框input、textarea等,copy对象使用:

调用方法:
copy: function(){
    return $('#mytext').val();
}
 
//如果是复制的内容来自页面元素div、p之类的,copy对象使用:
代码如下

 
copy: $('#mytext').text();
posted @ 2018-01-08 14:15  辣根弟弟  阅读(196)  评论(0编辑  收藏  举报