《程序员的第一年》---------- js复制图片与复制文本<待续兼容各浏览器的复制代码..>

zhongxiaobing

于 2013-08-15 18:00:57 发布

阅读量1.6k

点赞数

分类专栏：程序员的第一年技术日志程序人生

本文链接：https://blog.csdn.net/zhongxiaobing/article/details/9987737

版权

程序人生同时被 3 个专栏收录

33 篇文章 1 订阅

订阅专栏

程序员的第一年

29 篇文章 1 订阅

订阅专栏

技术日志

13 篇文章 0 订阅

订阅专栏

//批量复制图片
function CopyImages(content) {
    var container = document.createElement("div");
    container.innerHTML = content;
    document.body.appendChild(container);
    try {
        var ctrlRange = document.body.createControlRange(); //如果在此处抛出异常，则浏览器不支持复制图片操作
        try {
            var children = container.childNodes;
            for (var i = 0; i < children.length; i++) {
                ctrlRange.add(children[i]); //如果在此处抛出异常，则可能是因为浏览器不能添加div,只能以table展示
            }
            ctrlRange.execCommand('Copy');
            return true;
        }
        catch (ex) {
            //浏览器不支持添加div,只能以table展示，因此在div外侧包装一个只有一个单元格的table
            content = "<table><tr><td>" + content + "</td></tr></table>";
            return CopyImages(content);
        }
    }
    catch (err) {
        //alert("很报歉，只有IE浏览器支持复制图片操作，不过你可以复制代码！");
        return false;
    }
    finally {
        document.body.removeChild(container);
    }
}
function batchCopyPhotos_table() {
    var content = document.getElementById("TextBox1").value;
    var msg = document.getElementById("copyMsg")
    if (CopyImages(content)==false) {
        msg.innerText = "很报歉，只有IE浏览器支持复制图片操作！";
    }
    else {
        msg.innerText = "已成功复制图片";
    } 
    msg.style.display = "block";
    msg.style.visibility = "visible";
}
function batchCopyPhotosUrl() {

    var content = document.getElementById("TextBox1").value;
    var str = content;
    var url = ""; 
    //匹配图片（g表示匹配所有结果i表示区分大小写） 
    var imgReg = /<img.*?(?:>|\/>)/gi; 

    //匹配src属性 
    var srcReg = /src=[\'\"]?([^\'\"]*)[\'\"]?/i; 
    var arr = str.match(imgReg);  

    for (var i = 0; i < arr.length; i++) { 
        var src = arr[i].match(srcReg); 
        //获取图片地址 
        if (src[1]) {
            url += src[1]+"\n";
        }
    }
    var msg = document.getElementById("copyMsg")
    try {
        window.clipboardData.setData('text', url);
        msg.innerText = "已成功复制URL";
    } catch (e) {
        msg.innerText = "很报歉，只有IE浏览器支持此操作！";
    }
     
    msg.style.display = "block";
    msg.style.visibility = "visible"; 
}

=========================================================================

续改后的代码

//批量复制图片
function CopyImages(content) {
    var container = document.createElement("div");
    container.innerHTML = content;
    document.body.appendChild(container);
    try {
        var ctrlRange = document.body.createControlRange(); //如果在此处抛出异常，则浏览器不支持复制图片操作
        try {
            var children = container.childNodes;
            for (var i = 0; i < children.length; i++) {
                ctrlRange.add(children[i]); //如果在此处抛出异常，则可能是因为浏览器不能添加div,只能以table展示
            }
            ctrlRange.execCommand('Copy');
            return true;
        }
        catch (ex) {
            //浏览器不支持添加div,只能以table展示，因此在div外侧包装一个只有一个单元格的table
            content = "<table><tr><td>" + content + "</td></tr></table>";
            return CopyImages(content);
        }
    }
    catch (err) {
        //alert("很报歉，只有IE浏览器支持复制图片操作，不过你可以复制代码！");
        return false;
    }
    finally {
        document.body.removeChild(container);
    }
}

/*复制
-------------------------------------------------------------------------------------------*/
function copy(uri) {
     if (setClipboardData(uri)) {
         // alert("复制成功，按 Ctrl+V 粘贴"); 
        return true;
    } 
    return false; 
  //  alert("你的浏览器不支持自动复制，你可以使用IE或火狐浏览器，在管理图片页面可以进行手动复制");
}

function batchCopyPhotos_table() {
    var content = document.getElementById("TextBox1").value;
    var msg = document.getElementById("copyMsg")
    if (CopyImages(content)==false) {
        msg.innerText = "很报歉，只有IE浏览器支持复制图片操作！";
    }
    else {
        msg.innerText = "已成功复制图片，按 Ctrl+V 粘贴";
    } 
    msg.style.display = "block";
    msg.style.visibility = "visible";
}

//复制全部代码
function copyToClipboard() {
    var d = document.getElementById("TextBox1").value;

    var msg = document.getElementById("copyMsg") 
    try {
        if (copy(d)) {
            msg.innerText = "已成功复制代码，按 Ctrl+V 粘贴";
        }
        else {
            msg.innerText = "很报歉，您的浏览器不支持自动复制，您可选用IE或火狐浏览器，或进行手动复制";
        }
    } catch (e) {
        msg.innerText = "很报歉，您的浏览器不支持自动复制，您可选用IE或火狐浏览器，或进行手动复制";
    } 
    msg.style.display = "block";
    msg.style.visibility = "visible";
}

//复制全部URL
function batchCopyPhotosUrl(obj) {

    var content = document.getElementById("TextBox1").value;
    var str = content;
    var url = str; 
    //匹配图片（g表示匹配所有结果i表示区分大小写） 
    var imgReg = /<img.*?(?:>|\/>)/gi; 

    //匹配src属性 
    var srcReg = /src=[\'\"]?([^\'\"]*)[\'\"]?/i;
    var arr = str.match(imgReg);
    if (arr != null) {
        url = "";
        for (var i = 0; i < arr.length; i++) {
            var src = arr[i].match(srcReg);
            //获取图片地址 
            if (src[1]) {
                url += src[1] + "\n";
            }
        }
    }
    var msg = document.getElementById("copyMsg");
    try {
        if (copy(url)) {
            msg.innerText = "已成功复制URL，按 Ctrl+V 粘贴";
        }
        else {
            msg.innerText = "很报歉，您的浏览器不支持自动复制，您可选用IE或火狐浏览器，或进行手动复制";
        }
    } catch (e) {
        msg.innerText = "很报歉，您的浏览器不支持自动复制，您可选用IE或火狐浏览器，或进行手动复制";
    } 
    msg.style.display = "block";
    msg.style.visibility = "visible"; 
}


/* 复制内容到剪贴板，支持IE、Opera、firefox，不支持chrome
--------------------------------------------------------------*/
function setClipboardData(txt) {
    if (window.clipboardData) {
        window.clipboardData.clearData();
        if (window.clipboardData.setData("Text", txt)) {
            return true;
        } else {
            alert("在浏览器询问是否允许访问剪贴板时请选择允许，刷新页面再试一下吧！");
            return true;
        }
    } else if (navigator.userAgent.indexOf("Opera") != -1) {
        window.location = txt;
        return true;
    } else if (window.netscape) {
        try {
            netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
        } catch (e) {
            alert("您的firefox安全限制限制您进行剪贴板操作，请在地址栏输入’about:config’然后将signed.applets.codebase_principal_support’设置为true’之后重试");
            return false;
        }
        var clip = Components.classes['@mozilla.org/widget/clipboard;1'].createInstance(Components.interfaces.nsIClipboard);
        if (!clip)
            return false;
        var trans = Components.classes['@mozilla.org/widget/transferable;1'].createInstance(Components.interfaces.nsITransferable);
        if (!trans)
            return false;
        trans.addDataFlavor('text/unicode');
        var str = new Object();
        var len = new Object();
        var str = Components.classes["@mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString);
        var copytext = txt;
        str.data = copytext;
        trans.setTransferData("text/unicode", str, copytext.length * 2);
        var clipid = Components.interfaces.nsIClipboard;
        if (!clip)
            return false;
        clip.setData(trans, null, clipid.kGlobalClipboard);
        return true;
    }
}

此代码为兼容多版本浏览器复制粘贴功能代码

如有错误，希望大神指点