Javascript: Click to copy the current text to the clipboard (compatible with all browsers) _ javascript skills

This article mainly introduces how to copy the current text to the clipboard by clicking js, which is compatible with all browsers. If you are interested, refer to the website framework construction process in the recent project, there is a function that needs to copy text to the clipboard. I believe this function is very common, but it is a big challenge for me to write JavaScript code less often. I think back to a previous site, use window. clipboardData is used to copy data to the clipboard. It only supports IE and FF browsers. At that time, Baidu found several solutions and gave up without looking at them. Later I made a judgment in the code, if this attribute is not supported, you can directly use alert: This function does not support this browser. Please manually copy the content in the text box. Does anyone encounter the same situation?

Alert ("This function does not support this browser, please manually copy the content in the text box ");

Today I will share with you the function of copying data to the clipboard. Due to limited capabilities, please kindly advise on any errors ~

I believe that many people who have built websites using wordpress know that they use jQuery, which is easy to use and does not implement the clipboard copy function, however, its API may have this function. The website I set up this time adopts wordpress, and it took some time to search for the API for copying jQuery to the clipboard. There are also:JQuery ZeroClipboardIn wordpress, the clipboard copy function is simply implemented. But jQuery ZeroClipboard used to have a father namedZero Clipboard.

Zero Clipboard, as an independent js library, uses Flash for copying. It requires two files: ZeroClipboard. js and ZeroClipboard.swf. There are two versions on the network. The implementation principle is to use flash for copying. I don't know who the original is, or maybe two siblings in a family. This doesn't matter, as long as we respect copyright, we have a clear conscience. The version we will introduce to you today is relatively simple.

First, the flash Object generated after Zero Clipboard is used. It is compatible with flash10 and earlier versions and is compatible with all browsers:

Official address for Zero Clipboard: http://zeroclipboard.org /,

Some people may not know how to build a server environment when using it. There are many ways to build a server environment, such as xp or IIS that comes with Windows 7, you can also use integrated packages such as xampp, appserv, and APMServ to install them. It is very easy to build and will not be introduced here.

Now we should first use an independent js LibraryZero ClipboardThe clipboard copy function is simple. The demo is as follows:

Zero Clipboard Test
 
 Copy to clipboard
Enter the content to be copied