首页 > 其他分享 >复制文档到剪切板中空格,换行等会丢失的问题

复制文档到剪切板中空格,换行等会丢失的问题

时间:2023-05-26 15:57:15浏览次数:38  
标签:tempInput 换行 空格 文档 剪切板 input document

之前处理了fetch流的问题的时候,后端返回的流是含有空格、换行等内容的,然后要将这个流复制到剪切板中。就发现空格丢失部分,换行全部丢失了 发现问题解决问题,就去找为什么复制到剪切板中空格、换行会丢失。

 

 let content='   a b c d 
            d e f ^'//包含换行,空格等样式
var input = document.createElement("input");
document.body.appendChild(input);
input.setAttribute("value", content);
input.select();
if (document.execCommand("copy")) {
  document.execCommand("copy");
}
document.body.removeChild(input);

后来发现是用   document.createElement("input")  的原因,这是因为input框中的内容不包含换行,换行后的空格也不会写进去。所以就换了一种方式来写,将input换成textarea,因为textarea 是一个多行的文本输入控件,支持空格,换行等样式的存在的。

let content='   a b c d 
            d e f ^'//包含换行,空格等样式
var tempInput = document.createElement("textarea");
document.body.appendChild(tempInput);
tempInput.value = content;
tempInput.select();
document.execCommand("copy");
document.body.removeChild(tempInput);

问题成功解决了。

 

标签:tempInput,换行,空格,文档,剪切板,input,document
From: https://www.cnblogs.com/NicoleYe/p/17434939.html

相关文章

  • 快速制作60页,3500行软著代码文档的实用教程。
    本篇文章主要讲解,制作软著代码文档的高效方法,当然不可能手动一个个复制了,这显然太笨拙,他浪费时间了。这里我给大家介绍一个更快的方式。如下是我制作好的软著代码文档:说明:申请的要求是每页50行,页眉有软件的版本信息,页码信息,页脚有作者名,或者页脚有页码和作者名均可通过。图片......
  • WPS word文档插入图片显示不全
    一、右键段落二、行距由"固定值"修改为"单倍行距"......
  • 淘宝API技术文档解析,从入门到实战
    探索淘宝数据的奥秘,淘宝是目前国内最大的B2C电商平台之一,每天都会产生海量的数据。借助淘宝API技术文档,我们可以轻松地获取到这些数据,从而为电商运营和数据分析提供有力支持。1.什么是淘宝API?淘宝API(ApplicationProgrammingInterface)是一组软件API接口,可以让第三方应用程序和淘宝......
  • 转载:PageOffice调用本地office实现多人在线同时编辑Word文档
    说明:多人同时在线编辑文件大多数会出现文档相互覆盖的问题,后保存的文档会覆盖先保存的文档。pageoffice的这个功能可以用程序控制不同用户打开文件后,编辑Word文档中属于自己的区域,并且不会互相影响。1、环境:前端:vue后端:springboot、pageoffice5.4.0.3版本vue+springboot集成......
  • 文档关键信息提取形成知识图谱:基于NLP算法提取文本内容的关键信息生成信息图谱教程及
    文档关键信息提取形成知识图谱:基于NLP算法提取文本内容的关键信息生成信息图谱教程及码源(含pyltp安装使用教程)1.项目介绍目标:输入一篇文档,将文档进行关键信息提取,进行结构化,并最终组织成图谱组织形式,形成对文章语义信息的图谱化展示。如何用图谱和结构化的方式,即以简洁的方式对......
  • C# 打印PDF文档的10种方法
    转:C#打印PDF文档的10种方法-知乎(zhihu.com)前言 操作PDF文档时,打印是常见的需求之一。针对不同的打印需求,可分多种情况来进行,如设置静默打印、指定打印页码范围和打印纸张大小、双面打印、黑白打印等等。 经过测试,下面将对常见的几种PDF打印需求做一些归纳总结,这里归......
  • 解决问题---广西建工OA系统文档无法阅读的问题
    1。安装iweboffice插件1.oa的插件下载2.安装iweboffice插件2.使用wps企业版或者低版本office广西建工版本的wps:提取码:6eiU或者扫描二维码下载3.使用低版本的谷歌浏览器(其实只要chrome内核版本低就行,这就导致了使用89内核得360是可以用插件的)谷歌浏览器36......
  • API接口的技术说明文档
    API技术文档是指软件系统或应用程序的API接口的技术说明文档。它详细描述了API端点,资源,参数,请求和响应格式以及使用API的常见用例和最佳实践。1.为什么需要API技术文档?API技术文档是API的唯一方法,以便开发人员和其他用户快速理解API的所有方面。它提供了不同的API用例和示例,帮助开......
  • 【工具类】使用阿里oss实现图片、视频、文档上传
    使用阿里oss实现图片、视频、文档上传一、背景描述二、引入依赖三、配置文件四、接口实现一、背景描述功能是想实现图片、视频和文档的上传。项目技术栈:springboot(2.1.5.RELEASE)二、引入依赖<dependency><groupId>com.aliyun.oss</groupId><artifactId>aliyun-sd......
  • java基于springboot+vue的书籍学习平台管理系统,学期学习论坛管理系统,附源码+数据库+lw
    1、项目介绍困扰管理层的许多问题当中,书籍学习将会是不敢忽视的一块。但是管理好书籍学习又面临很多麻烦需要解决,在工作琐碎,记录繁多的情况下将书籍学习的当前情况反应给相关部门决策,等等。在此情况下开发一款书籍学习平台,于是乎变得非常合乎时宜。经过网上调查和搜集数据,......