Javascript - ZeroClipboard 复制的内容不会更新

Question

我有 2 个 pre block ，每个 block 都用一个 div 包裹并有一个复制按钮。

<div class="code">
    <a class="copy">copy</a>
    <pre>content of 1st pre</pre>
</div>

<div class="code">
    <a class="copy">copy</a>
    <pre>content of 2nd pre</pre>
</div>

$('.code').on('mouseenter', function() {
    var copy_button = $(this).find('.copy');
    var clip = new ZeroClipboard(copy_button, {moviePath: 'ZeroClipboard.swf'});
    var content = $(this).find('pre').text();

    // at this point, content is always right
    // alert(content);

    clip.on('mousedown', function(client, args) {
        // the content doesn't get updated here
        alert(content);

        clip.setText(content);
    });
});

问题是，它似乎总是复制 first-mouseentered-div 的内容。

假设我首先 mouseentered div2，然后单击复制，内容(content of 2nd pre)被复制好了。但是当我尝试复制第一个 pre 时，内容没有得到更新，它仍然是 第二个 pre 的内容。

我在这里做错了什么？我该如何解决这个问题？

Answer 1

好的，我找到了另一个 jQuery 插件 - zClip，它是使用 Zero Clipboard 库 构建的。它更易于使用和配置。

$('.copy').zclip({
    path: 'ZeroClipboard.swf',
    copy: function() {
        var tocopy = $(this).parent().find('pre').text();
        // formatting content
        // ...
        return tocopy;
    },
    beforeCopy:function(){
        // do something before copy
    },
    afterCopy:function(){
        // do something after copy
    }
});