美文网首页
一个高亮选择后自动复制然后鼠标中键无格式粘贴的代码

一个高亮选择后自动复制然后鼠标中键无格式粘贴的代码

作者: 秋轩夜语 | 来源:发表于2023-04-01 11:11 被阅读0次

一个高亮选择后自动复制然后鼠标中键无格式粘贴的代码

以下是一个基于JavaScript的代码示例,实现了在选择文本后自动复制,并通过鼠标中键无格式粘贴的功能来去除格式:

document.addEventListener('mouseup', function(e) {

  var selectedText = window.getSelection().toString();

  if (selectedText !== '') {

    // 创建一个临时的 textarea 元素

    var tempTextarea = document.createElement('textarea');

    tempTextarea.value = selectedText;

    document.body.appendChild(tempTextarea);

    // 选中文本并复制

    tempTextarea.select();

    document.execCommand('copy');

    // 从 body 中移除临时元素

    document.body.removeChild(tempTextarea);

  }

});

document.addEventListener('mousedown', function(e) {

  // 如果按下的是中键

  if (e.button === 1) {

    // 获取剪贴板中的纯文本内容

    var clipboardData = e.clipboardData || window.clipboardData;

    var pastedText = clipboardData.getData('text/plain');

    // 在当前光标位置插入纯文本

    var selection = window.getSelection();

    var range = selection.getRangeAt(0);

    var textNode = document.createTextNode(pastedText);

    range.deleteContents();

    range.insertNode(textNode);

    // 设置新的光标位置

    range.setStartAfter(textNode);

    range.setEndAfter(textNode);

    selection.removeAllRanges();

    selection.addRange(range);

    // 阻止默认粘贴行为

    e.preventDefault();

  }

});

在这个代码中,我们通过添加两个事件监听器来实现功能:

mouseup 事件监听器:当用户在页面中选择文本并松开鼠标时,我们将选中的文本复制到剪贴板中。

mousedown 事件监听器:当用户在页面中按下鼠标时,如果按下的是中键,则我们从剪贴板中获取纯文本内容,并在当前光标位置插入该文本。

需要注意的是,由于浏览器的安全策略,我们无法直接访问剪贴板中的内容,而只能通过用户的操作来触发剪贴板事件并获取内容。因此,在上面的代码中,我们使用了 e.clipboardData.getData

('text/plain') 来获取剪贴板中的纯文本内容。同时,我们也需要在代码中阻止默认的粘贴行为,以避免将带有格式的内容粘贴到页面中。

相关文章

  • Word 代码高亮

    Word代码高亮: 直接从Clion、VScode之类的编译器复制,粘贴到word,自动高亮,调节字体字号即可 想...

  • 命令行入门的总结

    1.终端里的复制粘贴 cmder 鼠标右键是粘贴 shift + insert是粘贴 鼠标选中即自动复制 Git ...

  • 学习小组Day3笔记-Tsubasa

    注意: linus的自动补全命令Tab linus的复制粘贴:(Windows)鼠标左键复制,鼠标右键粘贴;(Ma...

  • vs code 使用踩坑儿

    鼠标中键会粘贴选中内容,有时会很乌龙,毕竟手残禁用鼠标中键的粘贴操作: xmodmap -e "pointer =...

  • IDEA个性化设置

    Settings 复制粘贴代码时总是会自动格式化,或者自动缩进Settings - Eidtor - Genera...

  • eclipse复制代码到word显示高亮

    把代码折叠取消掉,“+”号点开。Ctrl +C复制之后,鼠标点一下代码区取消选择,然后在word上粘贴,不要使用粘...

  • 选择性粘贴的玩法

    (一)基本用法 复制粘贴 有六个功能 1 鼠标右键--复制粘贴 会把公式 格式 颜色全部粘贴过来 2 粘贴数值只粘...

  • scrt常用设置(完结)

    1. 设置为鼠标中间键粘贴 scrt用鼠标选中的区域能够被自动复制,但是粘贴要么用ctrl+V要么鼠标右键点选。我...

  • Cmder命令行操作

    一、复制粘贴 复制:鼠标选中所要复制的内容即可。 粘贴:鼠标右键或者Shift + Insert。 二、文件的增删...

  • photoshop零基础3

    一,复制剪切粘贴 选择一个普通图层(非背景图层),然后选择工具箱中的“矩形选框工具”,按住鼠标左键拖拽,绘制一个选...

网友评论

      本文标题:一个高亮选择后自动复制然后鼠标中键无格式粘贴的代码

      本文链接:https://www.haomeiwen.com/subject/ayvkddtx.html