V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
miniyao
V2EX  ›  JavaScript

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

  •  
  •   miniyao · 2018-01-17 08:51:21 +08:00 via iPhone · 4648 次点击
    这是一个创建于 2502 天前的主题,其中的信息可能已经有所发展或是发生改变。
    看到有个 clipboard.js 不知道浏览器兼容性好不好,考虑移动浏览器的话,哪个库兼容性最好?
    18 条回复    2018-01-17 10:57:08 +08:00
    xomix
        1
    xomix  
       2018-01-17 08:59:29 +08:00
    用 flash 的那几个库浏览器兼容性最好,没有兼容性需求其实都差不多。
    yulitian888
        2
    yulitian888  
       2018-01-17 09:01:16 +08:00
    mark
    一直用 flash 的。
    alex321
        3
    alex321  
       2018-01-17 09:07:26 +08:00
    纯手写 //////

    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  
       2018-01-17 09:26:14 +08:00
    flash 很多浏览器都有提示,不方便
    DUSTINTHEWIND
        5
    DUSTINTHEWIND  
       2018-01-17 09:27:51 +08:00
    不明白还有这么多人推荐 flash
    CDL
        6
    CDL  
       2018-01-17 09:33:12 +08:00
    移动端还有人推荐 flash 的
    attackonFourier
        7
    attackonFourier  
       2018-01-17 09:45:12 +08:00
    这个需求是个坑啊 clipboard 搞 pc 还是可以 移动端就有点相形见绌了
    seki
        8
    seki  
       2018-01-17 09:49:00 +08:00
    原理都是生成个 dom,把文字放进去,全选里面的文字,然后发送复制命令。clipboard.js 用的人多兼容性应该不错,但是 api 不好看
    hasbug
        9
    hasbug  
       2018-01-17 09:52:00 +08:00
    最近移动端也有需求,IOS 不能 falsh 啦,求个靠谱的。
    Blazings
        10
    Blazings  
       2018-01-17 09:56:03 +08:00
    现在还推荐 flash 是 49 年入国军?
    ii4Rookie
        11
    ii4Rookie  
       2018-01-17 10:13:18 +08:00
    坐等大牛
    ljsh0102
        12
    ljsh0102  
       2018-01-17 10:19:48 +08:00
    什么?大清都亡了?
    ioven
        13
    ioven  
       2018-01-17 10:32:39 +08:00
    找几个垃圾站看看,最近垃圾站都在自动复制 zhifubao 口令
    xiaojie668329
        14
    xiaojie668329  
       2018-01-17 10:35:45 +08:00 via iPhone
    自己手写啊,ios 和 安卓不一样。一个是创建一个 textarea 然后 select() 方法选择文字。一个是使用 selection api。最后执行 execCommand 命令。还有就是 ios 下面的微信浏览器,你复制一次之后,如果不粘贴,是无法进行第二次复制的……
    jason19659
        15
    jason19659  
       2018-01-17 10:39:10 +08:00
    clipboard.js? https://t2t2.cc/test.html 之前按照本站贴子写的点击领红包
    yasumoto
        16
    yasumoto  
       2018-01-17 10:40:34 +08:00
    // 复制
    $('.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  
       2018-01-17 10:55:25 +08:00 via Android
    clipboard.js
    官网不是说了兼容性嘛,而且都可以测试,看看自己目标用户的 top 环境
    onionnews
        18
    onionnews  
       2018-01-17 10:57:08 +08:00 via Android
    @ioven 中招过,主要不知道是哪个网站给自动复制的
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2564 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 30ms · UTC 05:01 · PVG 13:01 · LAX 21:01 · JFK 00:01
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.