zoukankan      html  css  js  c++  java
  • 关于js复制的那些事儿

    window.clipboardData的作用是在页面上将需要的东西复制到剪贴板上,提供了对于预定义的剪贴板格式的访问,以便在编辑操作中使用。

    三个方法
    (1)clearData(sDataFormat) 删除剪贴板中指定格式的数据。sDataFormat:"text","url"
    (2)getData(sDataFormat) 从剪贴板获取指定格式的数据。 sDataFormat:"text","url"
    (3)setData(sDataFormat, sData) 给剪贴板赋予指定格式的数据。返回 true 表示操作成功。 sDataFormat:"text","url","file","html","image",sData: 剪贴数据
    但这个对象是只针对IE的。。如果是其它的浏览器,则会用不了。
    对于其他浏览器,得用flash的功能,现在网上有人写了一个ZeroClipboard.js,ZeroClipboard.swf,只要将这两文件作相关改动就行了:可以实现任意浏览器的复制,当然要浏览器支持flash插件才行!
    这个方法原理是在一个透明的flash(对用户来说是不可见的)上覆盖一个dom元素比如button或div,当点击这个dom时,实际点击的是flash,
    从而访问flash的剪贴板。 可支持浏览器:Firefox / IE / opera / chorme / safari
    ZeroClipboard.js相关代码:https://github.com/zeroclipboard/zeroclipboard 
    -- 但是适用于移动端。

    H5:

    最近在做一个很小的复制功能,反复试了几遍,就是没找到完美的方法。

    最终得出结论:

    移动端常用复制方法:clipboard.js

    //文本复制:
    var clipboard = new Clipboard('#copy_text');
    clipboard.on('success', function(e) {
    console.info('Action:', e.action);
    console.info('Text:', e.text);
    console.info('Trigger:', e.trigger);
    $('#tipmsg').html('复制成功').addClass('alert-success').show().delay(1000).fadeOut();
    e.clearSelection();
    });
    clipboard.on('error', function(e) {
    console.error('Action:', e.action);
    console.error('Trigger:', e.trigger);
    });

    不支持ios9及以下系统。

    而js原生方法: 

    function copy(message) {
            var input = document.createElement("input");
                input.value = message;
                document.body.appendChild(input);
                input.select();
                input.setSelectionRange(0, input.value.length), document.execCommand('Copy');
                document.body.removeChild(input);
                $.toast("复制成功", "text");
    }

    也不支持ios9及以下系统。,真是够够的了。无解。

    秀出精彩的自己,让梦飞翔。
  • 相关阅读:
    js伪数组转数组
    前端解决跨域几种方式
    mac 下node,yarn安装及版本切换
    如何给一个数组对象去重
    cookie、session、sessionStorage 、localStorage 区别
    moment.js 时间戳转换
    tp框架,addAll方法报错,返回false
    js获得 json对象的个数(长度)
    php 魔术方法和魔术常量
    js 对象的创建方式和对象的区别
  • 原文地址:https://www.cnblogs.com/fangzhizi/p/9667702.html
Copyright © 2011-2022 走看看