一个复制粘贴的小技巧 - 边窗

/ 1评 / 0

通过JS在复制操作时添加尾巴什么的,常见的思路是利用Selection.selectAllChildren()、window.clipboardData.setData()或者window.execcommand('copy')。比如下面这段代码:

<p id="my_text">
this is a copy text.
</p>

<script>
document.getElementById("my_text").addEventListener('copy', function(e){
    const copy_obj = document.getSelection();
    e.clipboardData.setData('text/plain', copy_obj.toString() + "\nCopyright to 2020.");
    e.preventDefault();
});
</script>

但复制操作很多时候也会通过双击文本来自动选择,在Chrome浏览器中,双击文本会自动选择分词的文本或标签内的整段文本。在这个操作方式下,还有另外一种简单的办法来添加文本尾巴。上面的例子可以简单写为:

<p id="my_text">
this is a copy text.<span style="font-size:0"> Copyright to 2020.</span>
</p>

只要将添加的文本的font-size设置为0,便可实现文本不可见,双击复制粘贴时会自动添加尾巴的效果。但这种方式只适用于简单的文本添加,而无法实现HTML格式的尾巴。

知识共享许可协议  本作品采用知识共享署名-相同方式共享 4.0 国际许可协议进行许可。
  1. homeless说道:

    这个主题好熟悉,

发表回复

您的电子邮箱地址不会被公开。