原理:
1、document.execCommand可作用于以下類型的元素上:
- input
- textarea
- contenteditable屬性為"true"的元素
- designMode屬性為"on"的iframe元素
2或悲、使用select()方法選中需要復(fù)制的文本孙咪。
由于select()方法只能作用于文本框,所以用這個(gè)方法來實(shí)現(xiàn)復(fù)制功能有很大的局限性巡语。
若要突破限制翎蹈,則需要使用其它方式(比如手動(dòng))選中想要復(fù)制的文本。
簡(jiǎn)單實(shí)現(xiàn):
//html
<textarea style="width: 200px;height: 200px;" id="edit" autofocus></textarea>
<button id="copy">copy</button>
//js
document.getElementById('copy').addEventListener('click',function(e){
var dom=document.getElementById('edit');
dom.select(); //若是使用其它方式選中要復(fù)制的文本男公,則此處可去掉
document.execCommand('copy',false,null); //這一步是關(guān)鍵荤堪,會(huì)選中當(dāng)前窗口中被選中的文本。若是寫成:frames['frame'].document.execCommand('copy',false,null)枢赔,則會(huì)復(fù)制name=frame中被選中的文本
})
document.getElementById ('edit').addEventListener('copy',function(e){
console.log(e);
})