javascript - Javascript - ZeroClipboard 复制的内容没有得到更新

Question

我有 2pre个块，每个块都用一个 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.

假设我first鼠标进入 div2，然后单击复制，内容 ( content of 2nd pre) 复制得很好。但是当我尝试复制第一个 pre 时，内容没有得到更新，它仍然是content of 2nd pre.

我在这里做错了什么？我怎样才能解决这个问题？

Answer 1

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

$('.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
    }
});

Answer 2

您继续在鼠标输入时添加越来越多的事件。这应该取消绑定事件，因此您不必每次都添加：

.on('mouseout', function(){
    $(this).unbind();
});