前端开发您现在的位置是:首页 > 博客日志 > 前端开发

js复制自定义文本到剪贴板,复制内容添加小尾巴/版权信息

<a href='mailto:'>微wx笑</a>的头像微wx笑 2022-10-19前端开发 1 0关键字: js  剪贴板  

js复制自定义文本到剪贴板,复制内容添加小尾巴/版权信息代码一://将选中的图片生成bat下载命令function execHandleImg() { var textarea = document.createElement("texta

js复制自定义文本到剪贴板,复制内容添加小尾巴/版权信息pxx无知


pxx无知

代码一:pxx无知

//将选中的图片生成bat下载命令
function execHandleImg() {
    var textarea = document.createElement("textarea");
    var body = document.getElementsByTagName("body")[0];
    body.appendChild(textarea);
    textarea.value = "期望复制到剪贴板中的内容";
    textarea.setSelectionRange(0, textarea.value.length);
    selectionObj.empty();
    var range = document.createRange();
    range.selectNode(textarea);
    selectionObj.addRange(range);
    document.execCommand("copy");
    textarea.remove();
}

代码二:
pxx无知

对用户选择的内容进入处理,然后将处理后的内容放入剪贴板pxx无知

//将选中的图片生成bat下载命令
function execHandleImg() {
    var selectionObj = window.getSelection();
    var rangeObj = selectionObj.getRangeAt(0);
    var docFragment = rangeObj.cloneContents();
  //然后将docFragment渲染出来,获取其innerHTML即可。
    var testDiv = document.createElement("div");
    var textarea = document.createElement("textarea");
    var body = document.getElementsByTagName("body")[0];
    body.appendChild(textarea);
    testDiv.appendChild(docFragment);
    var selectHtml = testDiv.innerHTML;
    //console.log(selectHtml);
    //console.log("innerTEXT", testDiv.innerText);
    var actionData = getActionData(testDiv.innerHTML);
    //console.log("actionData", actionData);
    textarea.value = actionData;
    textarea.setSelectionRange(0, textarea.value.length);
    selectionObj.empty();
    var range = document.createRange();
    range.selectNode(textarea);
    selectionObj.addRange(range);
    document.execCommand("copy");
    selectionObj.empty();
    selectionObj.addRange(rangeObj);
    textarea.remove();
}

如果你希望在用户复制内容的时候,修改用户复制的内容,那么需要使用计时器
pxx无知

function onCopy(e) { 
    execHandleImg();
    return false;
}

//register event listener for copy events on document
document.addEventListener('copy',onCopy,true);

将 execHandleImg 函数中的 document.execCommand("copy"); 改为以下代码pxx无知

setTimeout(function(){
    document.execCommand("copy");
}, 100);

如果不使用计时器的话,会产生循环调用的错误。pxx无知

本文由 微wx笑 创作,采用 署名-非商业性使用-相同方式共享 4.0 许可协议,转载请附上原文出处链接及本声明。
原文链接:https://www.ivu4e.cn/blog/front/2022-10-19/1523.html

很赞哦! () 有话说 ()