jQuery获取剪贴板内容的方法

本文实例讲述了jQuery获取剪贴板内容的方法。分享给大家供大家参考，具体如下：

这两天弄fckeditor粘贴功能，随着工作的深入和在网上查询资料，知道了在网页中一般是不允许访问“剪贴板”的，因为这样存在着很大的安全隐患，我自己也尝试着写了一个简单的demo

在IE和FF中剪贴板的访问是可控的，但是在Opera、Chrome、Safari浏览器中是不允许访问的，这样就产生了浏览器兼容的问题，怎么样才能让其他的浏览器兼容这个功能呢，在网上查找了一些资料——“使用flash去访问剪贴板”，然后把得到的值给JS，这样间接的访问了剪贴板里面的内容了

下面的代码只支持IE和FF，是我在网上找的DEMO，自己只是在这里汇总了一下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script src="lib/jquery-1.6.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(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","<strong>my name is huangbiao</strong>");
  alert(window.clipboardData.getData("text"));
}
function ff_set(){
  //将copy变量的值放到内存当中去
  var copy="<strong>my name is huangbiao</strong>";
  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);
}
</script>
<title>浏览器访问剪贴板</title>
</head>
<body>
  <div>
    <span>在IE中是对外有接口的，可以通过window.clipboardData对象得到剪贴板的内容，这样就容易导致开发人员在后台写一个程序记录用户剪贴板的内容，这样可以把海量的数据集中起来做数据挖掘，这个对用户的安全来说是很可怕的，因此在访问的时候会提示用户是否允许访问剪贴板的内容。
    </span>
  </div><br>
  <div>
    <span>    在IE意外的浏览器是不允许访问剪贴板内容的，只有拒绝才是最安全的，所以在火狐等其他浏览器中不能通过window.clipboardData对象来访问剪贴板的内容
    </span>
  </div>
  <button id="show_clipbrd">显示剪贴板的内容</button>
  <button id="set_clipbrd">给剪贴板设置信息</button>
</body>
</html>

更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery常用插件及用法总结》、《jquery中Ajax用法总结》、《jQuery表格(table)操作技巧汇总》、《jQuery拖拽特效与技巧总结》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。

赞 (0)

相关推荐

  • jquery 一键复制到剪切板的实例

    今天做项目有一个功能,通过点击事件复制一段文本到剪切板,在网上找了一些,整理了一下,方便需要的朋友使用. <a id="copy" data-text="123456">复制文本</a> $(function(){ var clipboard = new Clipboard('#copy',{ text: function(trigger) { alert("复制成功!"); return trigger.getAttri

  • js复制到剪切板的实例方法

    复制代码 代码如下: <script type="text/javascript" language="javascript">         //复制到剪切板js代码         function copyToClipBoard(s) {             //alert(s);             if (window.clipboardData) {                 window.clipboardData.setD

  • js实现各种复制到剪贴板的方法(分享)

    一.实现点击按钮,复制文本框中的的内容 <script type="text/javascript"> function copyUrl2() { var Url2=document.getElementById("biao1"); Url2.select(); // 选择对象 document.execCommand("Copy"); // 执行浏览器复制命令 alert("已复制好,可贴粘."); } <

  • JS复制到剪贴板示例代码

    复制代码 代码如下: /* * 复制到剪贴板 * * */ function copyToClipboard(txt) { if(window.clipboardData) { window.clipboardData.clearData(); window.clipboardData.setData("Text", txt); } else if(navigator.userAgent.indexOf("Opera") != -1) { window.locati

  • jQuery获取剪贴板内容的方法

    本文实例讲述了jQuery获取剪贴板内容的方法.分享给大家供大家参考,具体如下: 这两天弄fckeditor粘贴功能,随着工作的深入和在网上查询资料,知道了在网页中一般是不允许访问"剪贴板"的,因为这样存在着很大的安全隐患,我自己也尝试着写了一个简单的demo 在IE和FF中剪贴板的访问是可控的,但是在Opera.Chrome.Safari浏览器中是不允许访问的,这样就产生了浏览器兼容的问题,怎么样才能让其他的浏览器兼容这个功能呢,在网上查找了一些资料--"使用flash去访

  • JS实现获取剪贴板内容的方法

    本文实例讲述了JS实现获取剪贴板内容的方法.分享给大家供大家参考,具体如下: 这里介绍了JS获取剪贴板内容的代码: <Script Language="JavaScript"> var content = clipboardData.getData("Text"); if (content!=null) { document.write("<center><font size=5 color=red>WARNING, T

  • python两种获取剪贴板内容的方法

    第一种 import win32clipboard import time #速度快 容易出错 class niubi(): def lihai(self): while True: #jianting().main() t = jianting().main() print(t) class jianting(): def clipboard_get(self): """获取剪贴板数据""" win32clipboard.OpenClipboa

  • JavaScript和JQuery获取DIV值的方法示例

    JavaScript和JQuery获取DIV值的方法示例

    本文实例讲述了JavaScript和JQuery获取DIV值的方法.分享给大家供大家参考,具体如下: 1.示例代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtm

  • jQuery获取文本内容和原生JS的异同之处

    jQuery获取文本内容和原生JS的异同之处

    目录 前言 一:html() 与 innerHTML 1.1 html() 对于内容的获取 1.2 html() 对于内容的设置 1.3 innerHTML 的设置与获取[原生JS 复习巩固] 1.3.1 innerHTML 对文本内容的获取 1.3.2 innerHTML 对文本内容的设置 二:text() 与 innerText 2.1 text() 对于内容的获取 2.2 text() 对于内容的设置 2.3 innerText 的设置与获取[原生JS 复习巩固] 2.3.1 innerT

  • php通过两层过滤获取留言内容的方法

    本文实例讲述了php通过两层过滤获取留言内容的方法.分享给大家供大家参考,具体如下: //两层过滤,获取留言的内容 $str='<div id="read_111111" style="font-size:14px;line-height:150%;padding:10px;">测试文字1<div id="lwd_12223"><h6 class="quote"><span class

  • python和shell获取文本内容的方法

    这两天搞脚本,花费不少时间. Python和Shell都可以获取文本内容,网上许多资料介绍的都不具体.简单的使用Python和Shell写了脚本. 做一些笔记沉淀一下. 1.Python实现: #-*- encoding:UTF-8 -*- filehandler = open('f.txt','r') #以读方式打开文件,rb为二进制方式(如图片或可执行文件等) print filehandler.read() #读取整个文件 filehandler.close() #关闭文件句柄 2.She

  • 对python pandas读取剪贴板内容的方法详解

    我使用的Python3.5,32版本win764位系统,pandas0.19版本,使用df=pd.read_clipboard()的时候读不到数据,百度查找解决方法,找到了一个比较靠谱的 打开site-packages\pandas\io\clipboard.py 在 text = clipboard_get() 后面一行 加入这句: text = text.decode('UTF-8') 保存,然后就可以使用了 df=pd.read_clipboard() #变成正常的了 下次可以在其他地方复

  • JavaScript或jQuery 获取option value值方法解析

    1.html <div class="form-group"> <label>保险公司</label> <select class="form-control" id="testSelect"> <option value="平安">平安保险</option> <option value="太平洋">太平洋保险</op

  • Domino中运用jQuery读取视图内容的方法

    jQuery是一个快速的,简洁的javaScript库,使用户能更方便地处理HTML documents.events.实现动画效果,并且方便地为网站或系统提供AJAX交互. 在Domino中应用jQuery框架能够大量简化js代码,并使得js的程序更加简洁和直观,下面是一个简单的例子,在表单中简单运用jQuery来读取视图内容. 1.在表单中加入以下代码并内置HTML: html 代码: <input type=button onclick="GetViewContent()"

随机推荐