如何在jsFiddle上单击一下jQuery中的简单ZeroClipboard复制到剪贴板设置？

Question

我正在努力让ZeroClipboard在jQuery上下文中工作.我所遵循的基本用法是在点击时剪切每个div类的文本copy.

以下jsFiddle使用稳定的ZeroClipboard v1.3.3双击

http://jsfiddle.net/bEQ6R/

HTML:

<div class="copy">Click this text to copy this text</div>
<div class="copy">Or click this text to copy this text</div>
<p class="debug flash-loaded">Flash player is loaded.</p>
<p class="debug confirm-copy">Text Copied.</p>
<textarea placeholder="Use this textarea to test your clipboard"></textarea>

JS:

$(document).ready(function() {
    ZeroClipboard.config({ moviePath: 'http://zeroclipboard.org/javascripts/zc/ZeroClipboard_1.3.2.swf',debug: true });    
    var client = new ZeroClipboard($('.copy'));
    client.on('load', function(client) {
        $('.flash-loaded').fadeIn();
        client.on('complete', function(client, args) {
            client.setText($(this).text());
            // client.setText('Manually Set Text to This instead of the contents of the div');
            console.log(client);
            $('.confirm-copy').fadeIn();
        });
    });
});

是的,我知道这里有其他类似的ZeroClipboard问题,但我还没有看到一个简单的jsFiddle版本实际工作.我遇到的现有小提琴要么已弃用,要么因其他原因不再有效.

此外,ZeroClipboard在他们自己的网站http://zeroclipboard.org/上针对相同版本的演示似乎工作得很好,所以我知道这是可能的.

Answer 1

这是一个有效的解决方案.在拨弄我换client.on('complete'...到client.on('mouseover'...初始化第一次点击前ZeroClipboard Flash文件.

$(document).ready(function() {
    ZeroClipboard.config({ moviePath: 'http://zeroclipboard.org/javascripts/zc/ZeroClipboard_1.3.2.swf',debug: true });

    var client = new ZeroClipboard($('.copy'));
    client.on('load', function(client) {
        $('.flash-loaded').text('Flash player loaded at ' + $.now()).fadeIn();
        client.on('mouseover', function(client, args) {
            client.setText($(this).text());
            $('.confirm-copy').text('text copied at ' + $.now()).fadeIn();
        });
    });
});