js设置剪贴板数据 event.clipboardData.setData("text/plain",value);不起作用,并非所有的浏览器都支持,限制了

前端js获取剪切板中的文本或者图片文件数据 前端js获取剪切板中的文本或者图片文件数据功能描述实现说明 功能描述 获取剪切板中的文本或者图片 实现 // 1. 监听paste事件,在进行粘贴的时候会触发 DOM节点.addEventListener('paste', function (event) { // 输出事件对象的clipboardData属性,如下图,数据存储在对象中,但是直接打开是看不到的,只有输出event.clipboardData对象的某个属性或方法才可以看到 console.log(event.clipboardData 阅读详情
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<script type="text/javascript">
var EventUtil={
getClipboardData:function(event){
var clipboardData=(event.clipboardData||window.clipboardData);
return clipboardData.getData("text");
},
setClipboardData:function(event,value){
if(event.clipboardData){
//return event.clipboardData.setData("text",value);
return event.clipboardData.setData("text/plain",value);
}else if(window.clipboardData){
return window.clipboardData.setData("text",value);
}
},
addHandler:function(element,type,handler){
if(element.addEventListener){
element.addEventListener(type,handler,false);
}else if(element.attachEvent){
element.attachEvent("on"+type,handler);
}else{
element["on"+type]=handler;
}
},
getEvent:function(event){
return event?event:window.event;
},
preventDefault:function(event){
if(event.preventDefault)
event.preventDefault();
else
event.returnValue=false;
}
}
function trimall(txt){
/*txt=txt.replace(/^\\s+/,'');
alert(txt);
txt=txt.replace(/\s+$/,'');
alert(txt);*/
txt=txt.replace(/(^\s*)|(\s*$)/g,"");
return txt; 
}

function doit(){
/*var txt=document.getElementById("ipt1").value;
alert(txt.length);
txt=trimall(txt);
alert(txt.length);
document.getElementById("ipt1").value=EventUtil.getClipboardData(event);*/
alert(EventUtil.getClipboardData(event));
}
</script>
<body>
<input id="ipt1" />
<input type="button" onclick="javascript:doit();"/>
</body>
<script type="text/javascript">
EventUtil.addHandler(document.getElementById("ipt1"),"paste",function adjustInput(event){
alert(EventUtil.getClipboardData(event));
event=EventUtil.getEvent(event);
var txt=EventUtil.getClipboardData(event);
txt=trimall(txt);

//event.clipboardData.setData("text/plain",value);不起作用,并非所有的浏览器都支持,限制了
//var rst=EventUtil.setClipboardData(event,txt);

EventUtil.preventDefault(event);
document.getElementById("ipt1").value=txt;
});
</script>
</html>
剪贴板操作 Clipboard API 教程 简介 浏览器允许 JavaScript 脚本读写剪贴板,自动复制或粘贴内容。 一般来说,脚本不应该改动用户的剪贴板,以免不符合用户的预期。但是,有些时候这样做确实能够带来方便,比如“一键复制”功能,用户点击一下按钮,指定的内容就自动进入剪贴板。 目前,一共有三种方法可以实现剪贴板操作。 Document.execCommand()方法 异步的 Clipboard API copy事件和paste事件 本文逐一介绍这三种方法。 Document.execCommand() 方法 Document.exec 阅读详情

相关推荐

华为AR3260路由器NAT回流配置实战:从WEB界面到命令行的完整避坑指南

本文详细解析了华为AR3260路由器NAT回流(Hairpin NAT)的配置原理与实战方法。针对内网用户无法通过公网地址访问内部服务器的常见问题,文章不仅剖析了WEB界面配置的常见报错原因,更提供了清晰、可靠且一劳永逸的命令行(CLI)配置方案与排错指南,帮助企业网络工程师彻底解决内外网访问不一致的难题。

u6v7w8x的博客 874

HTML5实战与剖析之剪贴板事件

很多网站当复制粘贴的时候,都会出现有关剪贴板的相关提示,在刚刚入行前端工程师的时候,我还在一直纳闷,这是怎么实现的呢。如今,咱们再也不用纳闷了,因为已经有浏览器把剪贴板相关事件纳入标准了。

梦龙小站 11万+

从波士顿动力SpotMini拆解看四足机器人机械设计:关节布局与电机选型的5个关键决策点

本文深入解析波士顿动力SpotMini四足机器人的机械设计,聚焦关节布局与电机选型的5个关键决策点。通过拆解髋关节偏移距、膝关节传动链、电机热管理等核心设计,揭示商业级四足机器人的工程智慧,为工业巡检、物流机器人等应用提供实用参考。

postgres8guard的博客 893

前端操作复制粘贴板(clicpboardData )

有时候我们经常会碰到这些场景:玩掘金、知乎的时候复制一段文字,总是会在内容后面加上一些版权信息,以及像小说网站等都有禁止选中,禁止复制这种功能,还有点击自动复制账号的功能。 我也经常遇到这些场景,有时候会去想这后面到底是怎么做,周末趁着有空去研究了一下,然后发现这些都跟操作剪贴板有关系,并且都不难,了解一下基本都知道怎么做了,整理分享一波给大家。 目录 API介绍 实现类知乎/...

u012028371的博客 7867

Inside NAND Flash Memories.中文版. Chatper 2 [2.1-2.2.1]

2.1 Introduction 半导体存储器分类: RAM:Random Access Memories--掉电丢失 ROM:Read Only Memories--只读,出厂时写好;掉电不丢失;不可更改。 NVM:Non-Volatile Memories--电可擦除/写入,并且掉电不丢失。第一类产品为EPROM memory (Erasable Programmable Read...

xuqikang的专栏 3606

Python虚拟环境实战:如何在不同conda环境中共享CUDA的libcupti.so.12文件

本文深入探讨了在Python虚拟环境中解决`ImportError: libcupti.so.12`报错的工程化方案。通过分析动态链接库的搜索机制,提供了环境变量法、软链接法和系统级配置法三种解决方案,帮助开发者在不同conda环境中高效共享CUDA动态链接库,确保深度学习项目的顺利运行。

weixin_29094775的博客 239

你不知道的copy、cut、paste事件——实现页面内容禁止复制,实现复制内容添加额外字段,比如复制请注明出处

聊聊copy复制、cut剪切、paste粘贴事件。 首先这三个事件都属于ClipboardEvent事件(剪切板事件)。复制、剪切、粘贴事件是浏览器对事件的监听,可以监听处理。但是默认情况下浏览器操作系统是可以复制、剪切、粘贴页面上的内容,将数据处理到操作系统的剪切板上。 比如:window系统的 Win+V快捷键可以展示剪切板。。。浏览器页面内容的复制、剪切、粘贴,正是浏览器操作系统的低层实现。 我们也可以通过监听浏览器的copy、cut、paste事件,从而阻止默认的复制内容行为。比如有的网站,不

zyz00000000的博客 4878

从零上手:基于RK3588平台的RKISP Tuner实战配置与核心功能解析

本文详细介绍了在RK3588平台上使用RKISP Tuner工具进行图像信号处理器(ISP)调试的完整实战流程。从MATLAB运行时环境搭建、服务端部署到核心连接,逐步解析如何通过图形化界面实时调节白平衡、锐化、降噪等参数以优化图像质量。文章重点阐述了实时预览、参数调试、抓图对比及参数保存等核心功能,为开发智能摄像头、机器人等AIoT设备的工程师提供了实用的配置指南与进阶技巧。

js777的博客 631

富文本编辑器初探

长期以来,作为用户我是富文本编辑器的使用者,作为前端开发,我也只是富文本插件的使用者,对内部实现细节不甚了解,使用上也只停留在调用插件提供的API,实现一些业务逻辑。最近的项目,需要开发一个简易富文本编辑器,也算是让我有机会对其一窥究竟。 可编辑富文本的方式 我们知道form表单中的input、textarea之类标签是支持内容可编辑的,但并不支持富文本,如果在这些标签里粘贴带格式的内容,...

嘿嘿 628

科研级YOLO26下采样革新:ContextGuided模块赋能,让特征降维兼具上下文感知的实战指南

在文件夹下新建,将上述类的代码写入其中。这一步是为了让YOLO26的代码架构能识别我们的自定义下采样模块。

LXY_LOVE36的博客 100

华为OD机试新系统真题【迷宫相遇】

华为OD机试 新系统真题【迷宫相遇】,提供C语言、Java、C++、Python、Go、JavaScript源码实现,并提供完整思路讲解,以及在线OJ模拟做题。华为OD机试真题【迷宫相遇】多语言题解。

qq_45776114的博客 767

JavaScript 中的复制粘贴操作

在日常业务开发,比如复制后增加版权信息,点击复制,等场景中需要进行复制粘贴的操作,以下是几种实现方案。 Clipboard API Clipboard API 提供了响应剪贴板命令(剪切、复制和粘贴)与异步读写系统剪贴板的能力。从权限 API (Permissions API) 获取权限之后,才能访问剪贴板内容;如果用户没有授予权限,则不允许读取剪贴板内容。 可以使用全局的 Navigator.clipboard 来访问剪贴板。 Navigator.clipboard 属性返回 Clipboard 对象,所

FEWY的博客 4194

R数据分析:广义估计方程式GEE的做法和解释

好久没有更新文章了,因为同学们咨询的问题有点多,另一个原因就是自己实在太懒。。。。 今天继续给大家写广义估计方程式GEE。 In statistics, a generalized estimating equation (GEE) is used to estimate the parameters of a generalized linear model with a possible unknown correlation between outcomes. 上面的英文解释告诉我们,当我们

Codewar的博客 1万+

JavaScript 技术篇-chrome利用ClipboardEvent写入剪切板,chrome写入剪切板不成功解决方法

JavaScript 技术篇-chrome利用ClipboardEvent写入剪切板,chrome写入剪切板不成功解决方法。 开始用 ClipboardEvent 怎么也不成功,后来仔细阅读开发文档才发现,需要通过 document.execCommand() 来执行 copy、paste 和 cut 命令,进而触发 ClipboardEvent 事件,才成功的。 我的 el 是绑定的某个 dom 节点,你可以直接替换为 document 也可以。

小蓝枣的博客 6279

OV9734 DATASHEET,完整规格书

OV9734完整规格书,包括电气参数,尺寸规格,寄存器配置表等

pscad IEEE标准系统搭建说明

pscad IEEE标准系统搭建说明,包含典型的IEEE 9节点、14节点、30节点、39节点和118节点系统。内含标准测试系统的原始数据和潮流结果。

window.clipboardData.setData使用:::

var bResult;// 选中要剪切的文本。在剪切事件中文本选中区的尾随空格导致剪// 切选快捷菜单项目保持无效。function fnLoad() {    var r = document.body.createTextRange();    r.findText(oSource.innerText);    r.select();}// 启用剪切快捷菜单项目,该项目在 DIV 上时默认为

退思园 3万+

IEM模型,地表粗糙度模拟

利用微波反演土壤水分时候,利用IEM模型可以实现对随机地表的模拟

navigator API妙用-实现复制粘贴功能

navigator是JavaScript中的一个内置对象,提供了许多有用的方法和属性,用于获取有关浏览器和其所在设备的信息。这些功能可以让开发者更好地了解用户的浏览环境,并根据浏览器、操作系统等条件进行适配,提高应用的用户体验。3. language 和 languages 属性:返回用户的首选语言或一组可接受的语言。1. userAgent 属性:返回包含浏览器厂商和版本等信息的字符串。7. mimeTypes 属性:返回浏览器支持的MIME类型数组。8. plugins 属性:返回已安装的插件数组。

JackieDYH的博客 792

迈瑞BS系列全自动生化分析仪LIS协议接口手册(内含HL7和ASTM)

迈瑞BS系列全自动生化分析仪LIS协议接口手册,内含HL7和ASTM)

clipboradData对象

clipboradData对象是一个event事件对象,在其原型中提供了三个操作方法,分别是:getData()、setData、claerDate(); 因为是事件对象,得通过触发oncopy或onpaste或oncut剪切板事件获得clipboradData对象; getDate获取剪切板数据; 比如: document.oncopy=function(){

前端开发技术 814

H5实现复制

一开始,在 Web 端,并没有任何可以接触到 clipborad 的内容。以前,我们想要执行 copy/paste/cut 只能借助 flash。但现在,伟大的 H5 又或者说 W3C 推出了关于 H5 操控 clipboard 的草案。我们一步一步来了解一下。先来看一下经典 execCommand 的使用。

weixin_42578774的博客 2056

onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"

这行代码这样解释 onbeforepaste 意思是在用户执行粘贴动作之前。 clipboardData.setData(‘text’, xxx) 是把xxx的内容复制到剪贴板 clipboardData.getData(‘text’) 是读出当前剪贴板里的内容, .replace(/[^\d]/g,’’) 是正则替换,把里面除了数字以外的字符全部都去掉, 整个语句的功能是,每当用户执行粘贴操作前...

weixin_43727391的博客 3079

js 复制粘贴板,当clipboardjs 不好使怎么办?

我一直觉得clipboardjs 这么常用的库应该不会有问题,应该是用法的问题,但因为本地的代理工具除了问题,无法抓包ios调试。经过几次调整尝试后仍然无法解决而且耽误较多的时间。于是转换思路,利用原生复制功能,双管齐下,但发现原生的navigator.clipboard 虽然是标准仍然有兼容性问题,安卓真机复制失败。我们这个复制按钮默认是隐藏的,用户操作之后才会出来,经过一番查询之后有文章指出,复制按钮初始化的时候元素必须存在,并且不能 "display:none"的方式隐藏。

webjhh的博客 1497

js 获取剪贴板文件和文本(解决js获取剪贴板文件总是为空)

// ctrl + v自然会触发paste事件,根本不用你自己去监听ctrl+v document.addEventListener('paste',function(event){ //ClipboardEvent // 获取文件 console.dir(event.clipboardData.files); // 获取文本 console.dir(event.clipboardData.getData('text')); }); 获取剪贴板文件时有两个坑: 坑1: c...

Don't lost way 4685

javascript:剪切板的使用(clipboardData.setData)和js中match函数

经常看到这样一种效果:就是单击一个按钮,就将某个区域内的内容,复制到了剪切板中。其实这个功能实现起来也不难,核心就是用到了window 子对象clipboardData 的一个方法:setData() 语法:     clipboardData.setData(sDataFormat, sData) 参数:sDataFormat:要复制的内容的格式;sData:要复制的内容。 返回值:复制成功返回true;失败返回false。 function jianqie(id) {var id;var

行云风随 1239

wangEditor富文本编辑器的调用开发实录2(V5版本自定义粘贴,去除复制word或网页html冗余样式代码的解决方案)

在使用wangEditor富文本编辑器时,当从word文档或者其他网页复制文本内容粘贴到编辑器中,如果不过滤掉复制文本中自带的样式,会导致复制的内容比较错乱,甚至无法添加到数据库中。为了解决这个问题,我们需要对从word中粘贴的内容进行处理,把多余的代码剔除,让粘贴后的文本变得更加简洁和轻量。

挖掘大数据价值,让决策者快速洞悉趋势,让大众读懂数据背后的故事。 2842

浏览器剪切板事件的学习(copy,cut,paste)

粘贴文章所有内容用户剪切板要添加属于自己附加的内容到用户的剪切板

【有梦想的菜】的博客 1460

事件类型—剪贴板事件

目录 一、事件分类 二、clipboardData对象 三、事件应用 一、事件分类 剪贴板事件有六个,分别是copy、cut、paste、beforecopy(忽略)、beforecut(忽略)和beforepaste(忽略)。 <input value="text" id="div"> <script> //copy事件:执行复制时触发 //...

雷雨天的雷胖子 1738

兼容多种浏览器“复制到剪贴板”的解决方案

昨天在也一个php程序的时候,要实现“复制到剪贴板”的功能,安全问题,浏览器的限制越来越严,实现的方法也越来越有限,这个简单的功能要想实现兼容不同的浏览器还真不容易,根据网上的一些资料结合我测试的经验,相关解决方案如下:方案一:利用“window.clipboardData”代码示例: if (window.clipboardData) { window.clipboard

守望轩 3252
上一篇: (转) Java文件路径(getResource)
下一篇: java vm 参数及设置(转载)
fantasyagain
博客等级 码龄19年 18粉丝 91原创
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值