js读取剪切板html,JS获取剪贴板的内容
这两天弄fckeditor粘贴功能,随着工作的深入和在网上查询资料,知道了在网页中一般是不允许访问“剪贴板”的,因为这样存在着很大的安全隐患,我自己也尝试着写了一个简单的demo
在IE和FF中剪贴板的访问是可控的,但是在Opera、Chrome、Safari浏览器中是不允许访问的,这样就产生了浏览器兼容的问题,怎么样才能让其他的浏览器兼容这个功能呢,在网上查找了一些资料——“使用flash去访问剪贴板”,然后把得到的值给JS,这样间接的访问了剪贴板里面的内容了
下面的代码只支持IE和FF,是我在网上找的DEMO,自己只是在这里汇总了一下:
$(document).ready(
function(){
$("#show_clipbrd").click(function(){
if($.browser.msie){
ie_Show();
}else{
ff_show();
}
});
$("#set_clipbrd").click(function(){
if($.browser.msie){
ie_set();
}else{
ff_set();
}
});
}
);
function ie_Show()
{
//得到剪贴板的内容
var str1=window.clipboardData.getData("text");
alert(str1);
}
function ff_show() {
netscape.security.PrivilegeManager.enablePrivilege('UniversalXPConnect');
var clip = Components.classes['@mozilla.org/widget/clipboard;1'].createInstance(Components.interfaces.nsIClipboard);
if (!clip) return;
var trans = Components.classes['@mozilla.org/widget/transferable;1'].createInstance(Components.interfaces.nsITransferable);
if (!trans) return;
trans.addDataFlavor('text/unicode');
clip.getData(trans, clip.kGlobalClipboard);
var str = new Object();
var len = new Object();
try {
trans.getTransferData('text/unicode', str, len);
} catch(error) {
return null;
}
if (str) {
if (Components.interfaces.nsISupportsWString) str = str.value.QueryInterface(Components.interfaces.nsISupportsWString);
else if (Components.interfaces.nsISupportsString) str = str.value.QueryInterface(Components.interfaces.nsISupportsString);
else str = null;
}
if (str) {
alert(str.data.substring(0, len.value / 2));
return (str.data.substring(0, len.value / 2));
}
return null;
}
function ie_set(){
//显示剪贴板的内容是text类型的,给剪贴板的赋值为后面的字符串
var str1=window.clipboardData.setData("text","my name is huangbiao");
alert(window.clipboardData.getData("text"));
}
function ff_set(){
//将copy变量的值放到内存当中去
var copy="my name is huangbiao";
netscape.security.PrivilegeManager.enablePrivilege('UniversalXPConnect');
var clip = Components.classes['@mozilla.org/widget/clipboard;1'].createInstance(Components.interfaces.nsIClipboard);
if (!clip) return;
var trans = Components.classes['@mozilla.org/widget/transferable;1'].createInstance(Components.interfaces.nsITransferable);
if (!trans) return;
trans.addDataFlavor('text/unicode');
var str = new Object();
var len = new Object();
var str = Components.classes["@mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString);
var copytext = copy;
str.data = copytext;
trans.setTransferData("text/unicode", str, copytext.length * 2);
var clipid = Components.interfaces.nsIClipboard;
if (!clip) return false;
clip.setData(trans, null, clipid.kGlobalClipboard);
alert("copy的信息为(可以用ctrl + v测试) :"+copy);
}
浏览器访问剪贴板
在IE中是对外有接口的,可以通过window.clipboardData对象得到剪贴板的内容,这样就容易导致开发人员在后台写一个程序记录用户剪贴板的内容,这样可以把海量的数据集中起来做数据挖掘,这个对用户的安全来说是很可怕的,因此在访问的时候会提示用户是否允许访问剪贴板的内容。
在IE意外的浏览器是不允许访问剪贴板内容的,只有拒绝才是最安全的,所以在火狐等其他浏览器中不能通过window.clipboardData对象来访问剪贴板的内容
显示剪贴板的内容
给剪贴板设置信息
js读取剪切板html,JS获取剪贴板的内容相关推荐
- js读取剪切板的图片
<script> function test(evt){ //for chrome var clipboardData = evt.clipboardData; for(var i=0; ...
- JS复制图片到剪切板 读取剪切板
JS复制图片到剪切板 读取剪切板 navigator.clipboard实现复制图片 图片写入剪切板 function handleCopyImg() { const canvas = documen ...
- html5读取剪切板 内容,实践笔记:js解析剪切板里的excel内容
这次记录的是昨晚一个想法:把excel内容复制到剪切板并转成自己想要的json格式,核心是要把excel内容转json,这部分主要看excel的格式和json如何业务的映射,不展开.倒是通过实践,收获 ...
- html粘贴excel内容,如何用JS解析剪切板里的excel内容
前言 这次记录的是昨晚一个想法:把excel内容复制到剪切板并转成自己想要的json格式,核心是要把excel内容转json,这部分主要看excel的格式和json如何业务的映射,不展开.倒是通过实践 ...
- 好程序员web前端分享js剪切板Clipboard.js 使用
好程序员web前端分享js剪切板Clipboard.js 使用,clipboard.js是一个用来设置剪切板的库,小巧无依赖,但用法有点诡异,必须依赖一个DOM元素. 必须要与一个DOM元素相关联,并 ...
- html5 读取剪切板,Html5剪切板功能的实现
本篇文章主要介绍了Html5剪切板功能的实现代码,内容挺不错的,现在分享给大家,也给大家做个参考. 最近使用Vue开发Line(日韩的一款类似中国微信平台)的内嵌H5.里面的有一个需求就是将当前链接粘 ...
- python获取剪切板图片_python 获取剪切板内容的两种方法
第一种 # -*- coding: utf-8 -*- # @Time : 2020/3/16 21:26 # @File : get_text_from_cupboard_13.py # @Auth ...
- JavaScript 技术篇-chrome浏览器读取剪切板命令document.execCommand(‘paste‘)返回false原因及解决方法
新版本 chrome 执行 document.execCommand('paste') 返回 false 因为读取剪切板涉及用户隐私安全,必须的用户允许的情况下可以进行访问,但是复制和剪切功能可以使用 ...
- android读取剪切板的方法,Android复制粘贴剪切板内容的一种方法
1 Clipper介绍 Clipper是一款简单的app, 它可以通过一行adb shell命令来和安卓系统剪切板服务交互. 官方说明:https://github.com/majido/clippe ...
- ios开发读取剪切板的内容_iOS中管理剪切板的UIPasteboard粘贴板类用法详解
一.自带剪切板操作的原生UI控件在iOS的UI系统中,有3个控件自带剪切板操作,分别是UITextField.UITextView与UIWebView.在这些控件的文字交互处进行长按手势可以在屏幕视图 ...
最新文章
- 《深入理解Spark:核心思想与源码分析》——1.2节Spark初体验
- java inputstream的read一次只能读到一个字节_20210118-JAVA面试题
- Android Studio 第六十一期 - Android ToastUtil
- Boost::context模块callcc的circle测试程序
- ASP.NET Core MVC压缩样式、脚本及总是复制文件到输出目录
- Vue介绍-Vue简单应用-Vue基本用法
- android点击地址调用地图,Android 实现点击按钮 调用手机外部地图导航
- shishuo-CMS-master
- 演讲(1)--演讲小故事
- 大型网站架构系列:负载均衡详解(3)
- Django 现可在 Windows Azure 上使用
- 在idea中设置java方法自定义注释
- div显示图片_图片按照百分比显示部分,不变形
- Maxwell安装与配置
- 创龙基于Xilinx Kintex-7系列高性价比FPGA开发板SMA端子、电源接口和拔码开关
- 小型矢量图标于前端页面如何应用
- 第十三届蓝桥杯模拟赛(第三期)试题与题解 C++
- 小程序开发之微信接入微信调用wenxin4j
- 苹果试玩换个新id行不_【图】- 日照市苹果app换个id重复刷试玩能不能 - 昆山玉山其他服务 - 昆山百姓网...
- 计算机管理文件和文件夹的实验结果及分析,大学计算机实验报告1