推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
miniyao

JS 实现点击 “复制” 文本到剪贴板,那个库兼容性最好?

  •  
  •   miniyao · Jan 17, 2018 via iPhone · 5210 views
    This topic created in 3049 days ago, the information mentioned may be changed or developed.
    看到有个 clipboard.js 不知道浏览器兼容性好不好,考虑移动浏览器的话,哪个库兼容性最好?
    18 replies    2018-01-17 10:57:08 +08:00
    xomix
        1
    xomix  
       Jan 17, 2018
    用 flash 的那几个库浏览器兼容性最好,没有兼容性需求其实都差不多。
    yulitian888
        2
    yulitian888  
       Jan 17, 2018
    mark
    一直用 flash 的。
    alex321
        3
    alex321  
       Jan 17, 2018
    纯手写 //////

    var sbox = document.createElement('input');
    sbox.setAttribute('id', 'el');
    sbox.setAttribute('value', value);
    document.body.appendChild(sbox);

    var el = document.getElementById('el');

    // check is iOS or not
    if(navigator.userAgent.match(/ipad|iphone/i)) {
    var editable = el.contentEditable;
    var readOnly = el.readOnly;

    el.contentEditable = true;
    el.readOnly = false;

    var range = document.createRange();
    range.selectNodeContents(el);

    var selection = window.getSelection();
    selection.removeAllRanges();
    selection.addRange(range);

    el.setSelectionRange(0, 999999);
    el.contentEditable = editable;
    el.readOnly = readOnly;
    } else {
    el.select();
    }

    //console.log(window.getSelection().toString());
    document.execCommand('Copy', false, null);
    MyDaLin
        4
    MyDaLin  
       Jan 17, 2018
    flash 很多浏览器都有提示,不方便
    DUSTINTHEWIND
        5
    DUSTINTHEWIND  
       Jan 17, 2018
    不明白还有这么多人推荐 flash
    CDL
        6
    CDL  
       Jan 17, 2018
    移动端还有人推荐 flash 的
    attackonFourier
        7
    attackonFourier  
       Jan 17, 2018
    这个需求是个坑啊 clipboard 搞 pc 还是可以 移动端就有点相形见绌了
    seki
        8
    seki  
       Jan 17, 2018
    原理都是生成个 dom,把文字放进去,全选里面的文字,然后发送复制命令。clipboard.js 用的人多兼容性应该不错,但是 api 不好看
    hasbug
        9
    hasbug  
       Jan 17, 2018
    最近移动端也有需求,IOS 不能 falsh 啦,求个靠谱的。
    Blazings
        10
    Blazings  
       Jan 17, 2018
    现在还推荐 flash 是 49 年入国军?
    ii4Rookie
        11
    ii4Rookie  
       Jan 17, 2018
    坐等大牛
    ljsh0102
        12
    ljsh0102  
       Jan 17, 2018
    什么?大清都亡了?
    ioven
        13
    ioven  
       Jan 17, 2018
    找几个垃圾站看看,最近垃圾站都在自动复制 zhifubao 口令
    voidcomma
        14
    voidcomma  
       Jan 17, 2018 via iPhone
    自己手写啊,ios 和 安卓不一样。一个是创建一个 textarea 然后 select() 方法选择文字。一个是使用 selection api。最后执行 execCommand 命令。还有就是 ios 下面的微信浏览器,你复制一次之后,如果不粘贴,是无法进行第二次复制的……
    jason19659
        15
    jason19659  
       Jan 17, 2018
    clipboard.js? https://t2t2.cc/test.html 之前按照本站贴子写的点击领红包
    yasumoto
        16
    yasumoto  
       Jan 17, 2018
    // 复制
    $('.follow__copy').click(function () {
    console.log($(this).parent().find('.follow__copy-content')[0])
    try {
    var range = document.createRange()
    var s = window.getSelection()
    if(s && s.rangeCount > 0) {
    for(var i = 0; i < s.rangeCount; i++) {
    s.removeRange(s.getRangeAt(i));
    }
    }
    range.selectNode($(this).parent().find('.follow__copy-content')[0])
    s.addRange(range)
    if (document.execCommand('copy')) {
    tip('复制成功')
    } else {
    tip('您的浏览器不支持,请手动复制')
    }
    } catch (e) {
    tip('您的浏览器不支持,请手动复制')
    }
    })

    发一个现在自己在用的复制代码把 可以兼容大部分浏览器
    iyaozhen
        17
    iyaozhen  
       Jan 17, 2018 via Android
    clipboard.js
    官网不是说了兼容性嘛,而且都可以测试,看看自己目标用户的 top 环境
    cname
        18
    cname  
       Jan 17, 2018 via Android
    @ioven 中招过,主要不知道是哪个网站给自动复制的
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   3053 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 107ms · UTC 03:03 · PVG 11:03 · LAX 20:03 · JFK 23:03
    ♥ Do have faith in what you're doing.