zClip不起作用 – 多个副本到剪贴板JS

我尝试复制到剪贴板按钮，但我不知道为什么我无法做到。 我用ajax加载我的页面，所以我调用一个函数，当我鼠标按下按钮时，将zclip添加到我的按钮。 但是当我点击它时，什么也没发生。 这是我的代码：JS：

<script type="text/javascript" src="zclip.min.js">  function mouseOver(){ $('.copyMails').each(function (k,n) { console.log("test"); var copyMails = $(this); $(this).zclip({ path: 'ZeroClipboard.swf', copy: function () { var val = $(copyMails).attr('data-clipboard-text'); return val; }, afterCopy: function () { console.log($(copyMails).data('clipboard-text') + " was copied to clipboard"); } }); }); }  

我的按钮：

 <button onmouseover="mouseOver()" data-clipboard-text="" class="copyMails" title="Copier les adresses emails"> Copier les adresses emails  

提前致谢。

Answer 1

我无法在我的服务器上运行，我从zclips网站下载了ZeroClipboard.swf并且无法正常工作。 我注意到zclips网站上的swf并不是他们用于示例的那个。 所以我创建了一个指向http://www.steamdev.com/zclip/js/ZeroClipboard.swf的超链接，然后单击“将链接保存为”，将其大小与我原先下载的大小进行比较，结果更大。 所以我将上面链接中的新内容放到我的服务器上，它运行得很好。

我想如果你从他们的下载链接直接从zclips网站下载了swf，这就是你的问题，因为它是我的。 尝试将我的链接保存为文件，然后将其上传到您的服务器。

Answer 2

您的示例中存在错误，至少与提供的内容有关。 尝试使用小提琴，你的mouseOver函数是未定义的。

我假设您的目的是在单击按钮时将数据复制到剪贴板，并在触发mouseover事件时设置剪贴板，对吗？ 如果是这种情况，最好的办法是为此创建一个单独的事件，将其委托给您的按钮类。 这样，对于与选择器匹配的所有元素，每次元素hover时，都不会继续配置剪贴板插件。

这是代码的示例，但我不相信您可以将SWF路径作为外部资源包含在小提琴中，因此它不能完全发挥作用。 所以我已经把我觉得很接近的代码版本放在了一起。 请试一试。

JSFiddle： http ： //jsfiddle.net/adx93ave/3/

 $(function () { $(document).on("mouseover", ".copyMails", function (evt) { var $btn = $(this); $btn.zclip({ path: 'http://www.steamdev.com/zclip/js/ZeroClipboard.swf', copy: $btn.data("clipboard-text"), afterCopy: function () { console.log($btn.data('clipboard-text') + " was copied to clipboard"); } }); }); });