javascript - ZeroClipboard在第一次点击时不起作用

流程摘要：
我写了一个jsp页面和一个js文件。该jsp包括带有可点击区域的表单。当用户单击那里时，js将带有onclick方法的按钮添加到jsp，如果用户单击该按钮，则应将一些文本复制到剪贴板。

JS将按钮添加到jsp：

<button id="copyToClipboard" title="Copy to clipboard" type="button" onclick="shareTransaction($(this))"></button>

JS onclick：

function shareTransaction(e) {
    $('#copyToClipboard').attr('data-clipboard-text',$(location).attr('protocol')+'//'+$(location).attr('host')+'/goblin/'+result);
    var zeroClipboard = new ZeroClipboard($("#copyToClipboard"));
}

第一次单击，什么都没有发生。在第二次单击中，文本已成功复制。

最佳答案

您可以在单击按钮之前尝试初始化ZeroClipboard对象。

样例代码：

<html>
    <head>
        <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.js"></script>
        <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/zeroclipboard/2.0.0/ZeroClipboard.Core.js"></script>
        <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/zeroclipboard/2.0.0/ZeroClipboard.js"></script>
        <script type="text/javascript">
            function initZc(){
                var button = $("button");
                console.log(button)
                var clip = new ZeroClipboard(button);
                clip.on( 'ready', function(event) {
                    clip.on('copy', function(event) {
                        event.clipboardData.setData('text/plain', "working");
                    });
                } );
            };
            $(document).ready(function(){
                $(document.body).append($("<button>click to copy</button>"));
                initZc();
            });
        </script>
    </head>
    <body>

    </body>
</html>

关于javascript - ZeroClipboard在第一次点击时不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/25601264/

JSP

javascript - ZeroClipboard在第一次点击时不起作用