1

我有一个网络应用程序，我想添加从...复制 HTML 和文本的功能，将其复制到剪贴板。

所以，我摆弄了 Zeroclipboard，无法让它工作，然后发现它不再被支持/开发。所以，我选择了一个名为 Zclip 的分支。

我想要一个函数，我可以将两个 div 传递给... 显示“复制文本”的 div/按钮在哪里......以及我们想要将文本复制到的目标 div 在哪里。我插入了“警报”来告诉我我得到了多远/尝试调试它。警报表明我们正在将正确的 div / 文本传递给 zclip。但是每次我检查我的剪贴板时，文本都不存在！

在 FF、IE 和 Chrome 上试试这个。

所以，我开始剥离我的文件来试图解决这个问题。这是我的测试页面：

<html>
<head>
     <script src="js/vendor/jquery-1.10.2.min.js"></script>
    <script src="http://www.steamdev.com/zclip/js/jquery.zclip.min.js"></script>
<script>

 $(document).ready(function(){

    var click_div_id = 'copy_results_table_to_CB';
    var source_div_id = 'results';

        alert("SetCopyableDiv was called for:   click_div_id = " + click_div_id + "     source_div_id to copy = " + source_div_id);

        $('#'+ click_div_id).zclip({
            path: 'http://www.steamdev.com/zclip/js/ZeroClipboard.swf',
            copy: function(){ 
                var text = $('#' + source_div_id).text();
                alert("Copy attempt made.   Text = " + text);
                console.log(text);
                return  text;
            },
            beforeCopy:function(){
            alert("Copy was pressed!");
            },
            afterCopy:function(){
                alert("Done with copy to clipboard!");
            }
        });
}); 

</script>
</head>
<body>

<div id="results" class="results">

<table class="data">
  <tr>
    <th>Entry Header 1</th>
    <th>Entry Header 2</th>
    <th>Entry Header 3</th>
    <th>Entry Header 4</th>
  </tr>
  <tr>
    <td>Entry First Line 1</td>
    <td>Entry First Line 2</td>
    <td>Entry First Line 3</td>
    <td>Entry First Line 4</td>
  </tr>
  <tr>
    <td>Entry Line 1</td>
    <td>Entry Line 2</td>
    <td>Entry Line 3</td>
    <td>Entry Line 4</td>
   </tr>
  <tr>
    <td>Entry Last Line 1</td>
    <td>Entry Last Line 2</td>
    <td>Entry Last Line 3</td>
    <td>Entry Last Line 4</td>
  </tr>
</table>

</div>

<button id="copy_results_table_to_CB">Copy to clipboard?</button>

</body>

我有一个 JSFiddle 在：http: //jsfiddle.net/DR4296/V52eK/

奇怪的是，“复制”警报弹出，然后是“复制前”警报，而“复制后”警报从未出现，这让我觉得有些东西真的令人窒息。

有什么想法吗？

4

1 回答 1

0

删除alert()incopy处理程序，它应该可以工作：

http://jsfiddle.net/V52eK/2/

$(document).ready(function(){

    var click_div_id = 'copy_results_table_to_CB';
    var source_div_id = 'results';

        $('#'+ click_div_id).zclip({
            path: 'http://www.steamdev.com/zclip/js/ZeroClipboard.swf',
            copy: function(){ 
                var text = $('#' + source_div_id).text();
                //alert("Copy attempt made.   Text = " + text);
                console.log(text);
                return  text;
            },
            beforeCopy:function(){
                //alert("Copy was pressed!");
            },
            afterCopy:function(){
                //alert("Done with copy to clipboard!");
            }
        });
});
于 2014-03-19T14:48:38.100 回答