郁闷吧 微信小程序 4188479 63242849 39070147 130690866
还没有任何记录...

博彩评级专注于网页素材下载,提供网站模板、网页设计、ps素材、图片素材等,服务于【个人站长】【网页设计师】和【web开发从业者】的代码素材与设计素材网站。

博彩评级提供网页素材下载、网站模板
这一切都是免费的!
当前位置:博彩评级 > javascript教程 >

js复制内容到剪贴板方案与兼容性

来源:郑州网站设计 作者: 博彩评级 日期:2016-12-06 人气:
js复制内容到剪贴板方案与兼容性,如果只考虑IE9以上高版本浏览器推荐使用document.execCommand或者Clipboard.js,如果你要兼容IE8或者其他低版本浏览器,那就要选择ZeroClipboard.js,当然如果你

本文地址:http://www.qqydc.com/javascript/js_copy.html
文章摘要:js复制内容到剪贴板方案与兼容性,夕惕若厉倒爷午间,盲肠炎积木陈永贵。

js复制内容到剪贴板方案与兼容性,如果只考虑IE9以上高版本浏览器推荐使用document.execCommand或者Clipboard.js,如果你要兼容IE8或者其他低版本浏览器,那就要选择ZeroClipboard.js,当然如果你要全兼容也可以用ZeroClipboard.js和另外两个配合,写个判断调用不同的插件来实现复制到剪切板。

使用document.execCommand() 实现复制内容到剪贴板

document.execCommand() 介绍

在这段代码里, 其实最核心就是 document.execCommand() 方法了, 该方法的大概用途是 对选中区域 进行一些操作 有关这个方法的具体介绍,

有关document.execCommand的介绍:http://www.qqydc.com/213/zh-CN/docs/Web/API/Document/execCommand

document.execCommand() 实现复制js代码

// 获取 input 元素
var input = document.getElementById('#showLink');
input.focus();
input.select();

// 执行复制命令
//document.execCommand('Copy');
try{
    if(document.execCommand('copy', false, null)){
        //success info  成功了放些提示
    } else{
        //fail info   失败了放些提示
    }
} catch(err){
    //fail info 失败了放些提示
}

注意:input元素不能type="hidden"和display:none否则js不能监听到input.select();  兼容chrome/ FF/ IE>9/ Safari新版
 

使用ZeroClipboard.js实现复制内容到剪贴板

ZeroClipboard.js是一个插件,利用flash可以访问系统剪切板的功能绕过所有浏览器,实现全兼容复制粘贴方案,
如果用户没有安装flash插件,那就不能用了,PC端的话应该不需要考虑这个问题,没有安装flash插件的用户浏览器几乎没有,移动端可能会有找不到flash插件的情况。
兼容所有安装了flash插件的浏览器

使用Clipboard.js实现复制内容到剪贴板

Clipboard.js是一个纯js复制内容到剪贴板的解决方案,Clipboard.js插件兼容chrome/ FF/ IE>9/ Safari新版

Clipboard的详细使用方法:js复制内容到剪贴板插件(clipboard.js)

Clipboard.js示例:

var clipboard = new Clipboard('.js-btn');

//可以自己加些处理
clipboard.on('success', function(e) {
    console.info('Action:', e.action);
    console.info('Text:', e.text);
    console.info('Trigger:', e.trigger);

    e.clearSelection();
});
clipboard.on('error', function(e) {
    console.error('Action:', e.action);
    console.error('Trigger:', e.trigger);
});

本文链接:js复制内容到剪贴板方案与兼容性http://www.qqydc.com/javascript/js_copy.html

js复制内容到剪贴板方案与兼容性由博彩评级收集整理,您可以自由传播,请主动带上本文链接

博彩评级就是免费分享,觉得有用就多来支持一下,没有能帮到您,懒人也只能表示遗憾,希望有一天能帮到您。

(责任编辑:博彩评级)