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

标签 javascript onclick copy clipboard 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/

相关文章:

javascript - 似乎无法清理分离的 DOM 元素

javascript - 处理对 YouTube New Look 的评论

javascript - 使用 JavaScript 处理表单中的多个提交按钮

java - Java编程中的HashMap

java - 将对象添加到数组时动态增加数组长度

javascript - 你能调用一个在调用者上下文中返回的函数吗?

javascript - 在 JavaScript 中添加和比较两个十进制数

javascript - 函数适用于 onClick 但不使用事件监听器

javascript - 单击功能可显示悬停叠加层 - 单击时显示,但第二次单击时不会消失

java - 在 Linux/Java 中调度文件/文件夹复制的应用程序