Compatible with the copy to clipboard function of all browsers, the suspension layer can not be copied to solve the problem

Browser replication is actually a very troublesome problem, because it involves browser security, so browser Bensheng will not provide the corresponding interface, and we have no way to achieve this function through pure js, but you will see that many websites, such as Baidu cloud disk, have achieved this function, so how exactly do they achieve it? today, let me show you their secret.

First of all, this function is very important to me, because private sharing to the turntable network must have this function. The screenshot is as follows:

As long as you click the I copy button, the password shared by the network disk will be automatically copied to your browser. In fact, I spent a lot of time on this function at the beginning, because it involves the replication of the suspension layer, the problem suddenly increases a lot of difficulty, but now I am still willing to release the code, I hope you like it. By the way, I point out several other blog codes I wrote, which I hope I like:

Baidu disk crawler

Baidu picture crawler

Ok searches the crawler source code

Java word segmentation algorithm

Invite friends to register

Automatic backup of database

OK, now let's get back to the point. Browser replication requires two plug-ins. Please download: download address 1 download address 2

The code is as follows:

Var clip=null; clip= new ZeroClipboard.Client (); / / new an object clip.setText (null); ZeroClipboard.setMoviePath ('${pageContext.request.contextPath} / media/js/ZeroClipboard.swf'); / / you need to set setmoviepath / / ZeroClipboard.setMoviePath ('.. / media/js/zeroclipboard10.swf'); clip.setHandCursor (true) if you and html are not in the same directory Clip.addEventListener ('mousedown', function (client) {window.passwd = document.getElementById ("file-password"). Value; clip.setText (window.passwd); clip.addEventListener (' complete', function (client, text) {window.url = document.getElementById ("file-url") .value Var id=get_param ("id"); var type=get_param ("type"); window.open (window.url,'_self'); $('.theme-popover') .hide (); $(' .theme-popover-mask') .hide (); / copy box dismiss document.getElementById ("theme-popover") .style.style = "hidden" / / Shadow / / record download information $.ajax ({type: "post", url: "${pageContext.request.contextPath} / download/statistic.action", dataType: "json" Data: {id:id, type:type}, success:function (data) { }});}); clip.glue ('copy-password','copy-dialog')

The record download information in the code has something to do with going to the turntable network, you don't have to care, the following sentence:

Document.getElementById ("theme-popover") .style.style = "hidden"; / / Shadow Collection

Very important, because the suspension layer copy, if it is relative to the layout flash can not find the overlay button, so at the beginning

Document.getElementById ("theme-popover") .style.style = "visible"; / / display when sharing privately

Finally, we have to hide it.