js控制快捷选择文本,实现内容的快捷复制粘贴

2021-03-30  本文已影响0人  sunny_wen

需求描述:用户想要通过单击某个文本标签,快速选中该标签内的文本内容并将内容添加至剪切板,供用户实现快速的粘贴内容。

实现思路:首先要针对文本标签添加点击事件,通过window.getSelection方法获取到selection对象,并通过该对象的selectAllChildren()方法实现快速选中文本内容的功能。最后通过document.execCommand('copy')方法实现将内容复制到粘贴板的效果。

selection.selectAllChildren(parentNode)方法,会将所有parentNode元素的子元素会被设为选中区域,parentNode本身除外。

代码实现:

实现效果:

(单击选中文本) (直接可以粘贴到文本框中)

参考文献:https://developer.mozilla.org/zh-CN/docs/Web/API/Selection/selectAllChildren

上一篇 下一篇

猜你喜欢

热点阅读