Question

我有两个pre块，每个块都用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();
});

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

2 个答案: