复制图片路径到剪切板(兼容各个浏览器)

时间:2022-09-14 21:04:55
<script type="text/javascript">
ZeroClipboard.setMoviePath( '${SITE.static_context}/js/ZeroClipboard10.swf' );//<!--替换为正确的ZeroClipboard10.swf路径-->
var clip = null;
//<!--btn_id,btn_id2用于定位flash,test_str为传入的文本,isId为0或者控件ID-->
function copy_code(btn_id,btn_id2) {
  var img_url=$("#img_wheel").attr("src");
  img_url="http://localhost:8080/web_nodo/"+img_url;
  clip = new ZeroClipboard.Client();
  clip.setHandCursor(true);
  clip.addEventListener('mouseOver', function (client) {
  //<!-- update the text on mouse over-->
  //<!--传入ID时,用ID的value替换文本。-->
    clip.setText(img_url);
      });
    clip.addEventListener('complete', function (client, text) {
    alert("复制成功,你可以使用Ctrl+V 粘贴。");
    clip.destroy();
  });
    clip.glue(btn_id,btn_id2);
 }
 
</script>
<div id="d_clip_container" style="position:relative;" >
            <a href="javascript:void(0)" class="copy_img_url" onmouseover="copy_code(this.id,'d_clip_container');"  title="保存星盘图片" id="btn_copy" style="">复制图片路径</a>
            </div>

ZeroClipboard.js
ZeroClipboard10.swf

大概代码是这样,但是还需要ZeroClipboard.js,ZeroClipboard10.swf 

你可以在https://code.google.com/p/zeroclipboard/下载ZeroClipboard.zip,文件并解压缩得到这两个js和swf文件

注意:这两个文件最好是放在同一个目录下。否则还得设置他的路径。

以上是可以兼容各个浏览器的。复制文本都可以。

一下是直接复制图片到剪切板或桌面;但仅限于ie浏览下,或者ie内核的浏览器

function CopyImage(img) {
    if(navigator.userAgent.indexOf("MSIE")>0){//判读ie浏览器
        //just allow use in the IE
       var ctrl = document.body.createControlRange(); 
       img.contentEditable = true; 
       ctrl.addElement(img); 
       ctrl.execCommand('Copy'); 
       img.contentEditable = false; 
       alert('复制图片完成'); 
    }
<img id="img_wheel" name="anImage" onclick="CopyImage(this)" src="${img_url }" />