web 复制功能和span光标

时间：2024-06-05 13:35:56

参考文章：https://www.cnblogs.com/tugenhua0707/p/7395966.html

https://blog.****.net/woshinia/article/details/18664903

document..execCommand(”Cut”,”false”,null);//剪贴选中的文字到剪贴板;

document..execCommand(”Copy”,”false”,null);//剪贴选中的文字到剪贴板;

document..execCommand(”Paste”,”false”,null);//剪贴选中的文字到剪贴板;

document..execCommand(”SelectAll”,”false”,null);//剪贴选中的文字到剪贴板;

不让页面被选择：-webkit-user-select:none;user-select:none;

首先复制的内容必须是选中的内容。因此：可采用textarea

textarea{
　　resize:none;   //去掉小三角
　　border:none;   //去掉边框
}

<button id="start">开始</button>

<textarea type="text" id="test" >全选全选est</textarea>

$("#start").click(function(){

$("#test").select();

document.execCommand("copy");

alert("已复制。。。");

});

对于Span元素可采用Range加Selection：

--注意断点跟踪会导致聚焦选择丢失。

var range = document.createRange();

        var text = $('span')[0];

        range.selectNode(text);

        //range.cloneContents().textContent;

        var select = document.getSelection();

        select.addRange(range);

对于复制还可以使用clipboard.js

https://clipboardjs.com/

官网上和下载的内容中有demo，可以使用。非常简单好用，同样不能用parse。

相关文章