jquery/javascript复制到剪贴板

我使用http://www.steamdev.com/zclip/#usage将一些文本复制到剪贴板，并且代码正常工作。它使用闪光灯创建交叉浏览器解决方案，它基于ZeroClipboard，这似乎被认为是目前最好的工作解决方案。jquery/javascript复制到剪贴板

但是我想多次复制到我的页面上的剪贴板按钮或链接。这是一个例子。

http://jsfiddle.net/stofke/TB23d/

此代码的工作，它复制优惠券代码到剪贴板上的文本，然后用正确的链接打开了新的一页。如何在其他链接上使用该代码，而无需为每个链接/ ID复制该代码。

只需使用类

$(function() { 
$('.copy').zclip({ 
    path: 'http://shopsheep.com/js/ZeroClipboard.swf', 
    copy: $(this).text(), 
    afterCopy: function() { 
     window.open($(this).attr('href')); 
    } 
});

}）;

不工作：你可以在这里看到：http://jsfiddle.net/stofke/EAZYW/ 如果去掉afterCopy功能，你会看到$（本）的.text（）将返回，而不是整个页面只是文本的链接标签之间。

做这样的事情

$(function() { 
$('a.copy', this).zclip({ 
    path: 'http://shopsheep.com/js/ZeroClipboard.swf', 
    copy: $('a.copy', this).text(), 

});

}）;

略有改善，但会返回链接标记之间的所有文本，如您在此处看到的。 http://jsfiddle.net/stofke/hAh3j/

来源

2011-03-31 Stofke

这似乎是工作 - 有人也许能使其更加优雅

http://jsfiddle.net/5nLw6/7/

$(function() { 
    $('.copy').each(function() { 
     var linkId = $(this).attr("id"); 
     $(this).zclip({ 
     path: 'http://shopsheep.com/js/ZeroClipboard.swf', 
     copy: $("#"+linkId).text(), 
     afterCopy: function() { 
      window.open($('#'+linkId).attr('href')); 
     } 
    }); 
    }); 
});

来源

2011-03-31 06:51:53 mplungjan

我试过，但它不工作。试着用这段代码分析jsfiddle，你会发现它不起作用。 http：// jsfiddle。net/stofke/EAZYW/ – Stofke 2011-03-31 06:55:13

@Stofke请参阅更新 – mplungjan 2011-03-31 07:48:44

是的，按照我想要的方式工作 – Stofke 2011-03-31 07:55:26

我却发现，使用ZeroClipboard直接也很简单，我只是说在此代码如果有人想要不使用zclip的解决方案。

ZeroClipboard.setMoviePath('http://shopsheep.com/js/ZeroClipboard.swf'); 
$(document).ready(function() { 
    $(".copy").each(function(i) { 
     var clip = new ZeroClipboard.Client(); 
     var myTextToCopy = $(this).text(); 
     var myTextUrl = $(this).attr('href'); 
     clip.setText(myTextToCopy); 
     clip.addEventListener('complete', function(client, text) { 
      window.open(myTextUrl); 
     }); 
     clip.glue($(this).attr("id")); 
    }); 
});

http://jsfiddle.net/stofke/JxMbd/

来源

2011-03-31 07:54:19 Stofke

这是我们按照巴菲特真技术。

要使用零复制到剪贴板，您需要两个文件 1。 ZeroClipboard.js
2 .ZeroClipboard.swf 两个文件可以从这里下载

<html> 
<head> 
    <script src =”../ZeroClipboard.js”></script> 
    <script > 
    // configure ZeroClipboard first 
    ZeroClipboard.config({ moviePath : /path/swffile/ZeroClipboard.swf }); 

    // initialize constructor 
    var client = new ZeroClipboard($(“#elementid”)); 

    /* elementid is the element on which click , the data will copy to clipboard. you can also pass multiple elements, it use jquery selector */ 
     </script> 
<body> 
<input type=”text” id =”targetid”></button> 
<button id =”elementid” data-clipboard-text ='data for copy’ >copy</button> 
</body> 
</head> 
<html>

数据剪贴板文本属性的值，当元素上的事件ACCUR传递给ZeroClipboard的构造ZeroClipboard自动复制

来源

2016-10-14 11:01:11

轻量级jQuery解决方案...重复使用类从任何元素复制文本。

$(document).on('click', '.copytoclipboard', function(e) { 
    if($("#holdtext").length < 1) 
    $("body").append('<textarea id="holdtext" style="height:0;width:0;border:0;outline:0;resize:none;"></textarea>'); 
    $("#holdtext").val($(this).text()).select(); 
    document.execCommand("Copy"); 
});

来源

2017-02-10 12:16:02 Dazza

jquery/javascript复制到剪贴板

回答

相关问题