JavaScript 实现对 HTML data-* 属性数据的复制

JavaScript 实现对 HTML data-* 属性数据的复制,点击复制按钮复制指定文本内容,实现网页中的复制功能。

1.HTML部分:

<a href="javascript:;" onclick="copy(this);return false;" data-text="ABCDEFG"  title="复制"></a>

2.JavaScript函数部分:

function copy(obj){
    var _text = $(obj).attr("data-text");
    console.log(_text);
    copyTextToClipboard(_text);
}
//复制的主函数
function copyTextToClipboard(text){
    var input = document.createElement("input");
    input.style.position = 'fixed';
    input.style.top = 0;
    input.style.left = 0;
    input.style.width = '2em';
    input.style.height = '2em';
    input.style.padding = 0;
    input.style.border = 'none';
    input.style.outline = 'none';
    input.style.boxShadow = 'none';
    input.style.background = 'transparent';
    input.value = text;
    document.body.appendChild(input);
    //选择对象
    input.select();
    try {
        //执行浏览器复制命令
        var successful = document.execCommand('copy');
        var msg = successful ? '成功复制,可前往贴粘。' : '复制失败';
        console.log(msg);
    } catch (err) {
        console.log('复制失败!!');
    }
    document.body.removeChild(input);
}

除特别注明外,本站所有文章均为原创,转载请注明原文链接:https://www.myblogbo.com/article/15.html

 Top