Of Stack

jQuery method of getting clipboard contents

  • 2021-06-28 10:59:58
  • OfStack

This article provides an example of how jQuery can get clipboard content.Share it for your reference, as follows:

These two days I worked on the fckeditor paste function. As I went deeper and looked up the data online, I learned that clipboard access is generally not allowed in Web pages, because there is a big security risk. I also tried to write a simple demo myself.

Access to the clipboard is controllable in IE and FF, but is not allowed in Opera, Chrome, Safari browsers. This creates a browser compatibility problem. How to make other browsers compatible with this feature? Looked for some information on the web - "Use flash to access the clipboard", and gave the value to JS.This indirectly accesses the contents of the clipboard

The following code only supports IE and FF, the DEMO I found on the Internet, and I just summarize it here: 


<!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()
{
  // Get the contents of the clipboard 
  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(){
  // Show the contents of the clipboard text Type , Assignment to clipboard to subsequent string 
  var str1=window.clipboardData.setData("text","<strong>my name is huangbiao</strong>");
  alert(window.clipboardData.getData("text"));
}
function ff_set(){
  // take copy Put the value of the variable in memory 
  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 The information is (can be used with ctrl + v Test)   : "+copy);
}
</script>
<title> Browser Access Clipboard </title>
</head>
<body>
  <div>
    <span> stay IE The interface is external through the window.clipboardData Objects get the contents of the clipboard, which makes it easy for developers to write in the background 1 Each program records the contents of a user's clipboard, which allows data mining from a large number of datasets. This is terrible for user security, so when accessing it, users are prompted to allow access to the clipboard's contents. 
    </span>
  </div><br>
  <div>
    <span>     stay IE Unexpected browsers do not allow access to clipboard content, only rejection is the safest, so it cannot be passed in other browsers such as Firefox window.clipboardData Object to access the contents of the clipboard 
    </span>
  </div>
  <button id="show_clipbrd"> Show the contents of the clipboard </button>
  <button id="set_clipbrd"> Set information for clipboard </button>
</body>
</html>

More readers interested in jQuery-related content can view this site's topics: jQuery Common Plug-ins and Usage Summary, Ajax Usage Summary in jquery, jQuery Table (table) Operation Skills Summary, jQuery Drag and Skills Summary, jQuery Extension Skills Summary, jQuery Common Classic Special Effects Summary, andjQuery Animation and Utility Summary and jquery Selector Usage Summary

I hope that the description in this paper will be helpful to everyone's jQuery program design.

Related articles: