In the past two days, when I was working on the Web Front-end, I encountered the need to use js to implement the text copy function. I would like to share with you the support of various browsers for the copy function, if you are interested, refer to the following two days when you are working on the Web Front-end, you may need to use JavaScript to implement text replication.
First, let's look at the support of various browsers for the replication function without considering the browser compatibility:
1. There are three solutions for IE browser:
The Code is as follows:
Function copy (txtid ){
Var txtObj = document. getElementById (txtid );
If (window. clipboardData) {// only IE supports this object. firefox and chrome do not.
// 1. Implement Replication through the clipboardData object
// Window. clipboardData. clearData ();
// Window. clipboardData. setData ("Text", txtObj. value );
// 2. Copy by using the document Object: select the moderate text before executing the Copy command.
// TxtObj. select ();
// Document.exe cCommand ("Copy"); // only supported by IE, syntax error reported by Firefox, false returned by chrome execution result (not supported)
// 3. Use the TextRange object to copy the file: you do not need to select the content first.
Txtobj.createtextrange(cmd.exe cCommand ("Copy ");
}
}
2. Firefox is implemented through the interface. Firefox disables this interface after Version 17 for security reasons and is available in Version 17 and earlier versions. The Code is as follows:
The Code is as follows:
Var clip = Components. classes ['@ mozilla.org/widget/clipboard=1').createinstance (Components. interface. nsIClipboard );
3. Chrome does not provide users with clipboard operations for security purposes. It can be seen that various browsers do not support the replication function in a uniform way.
Zero Clipboard Library
The js class library of Zero Clipboard written by jhuckaby uses Flash to copy the content to the Clipboard. As long as the browser is installed with the Flash plug-in, the content can be copied. The limitations of JavaScript are shielded by using ActionScript to solve the compatibility problem of cross-browser replication.
Implementation principle of Zero Clipboard: Zero Clipboard first generates the Flash Object Tag, so that transparent Flash floats on the copy button. In fact, the click is not a button but Flash, so that the required content is transmitted to Flash, then copy to the system Clipboard through Flash.
How to use Zero Clipboard
Note: It may be okay to add the role to a trusted location. I tried it, but it still does not work, or it may be a problem with my local browser.
1> download the compressed Zero Clipboard package, decompress the package, and put the files zeroclipboard.jsand zeroclipboard.swf in the folder into your project;
2> introduce the Zero Clipboard. js file with the following code:
