0

如果这不能用于跨浏览器,那么任何评论将不胜感激。

我想要实现的是我的页面上的多个“复制到剪贴板”链接,例如......

<a href="#" data-copy="<?php echo $original[0]; ?>" class="copy">Copy Original Link</a>
<a href="#" data-copy="<?php echo $medium[0]; ?>" class="copy">Copy Medium Link</a>
<a href="#" data-copy="<?php echo $web[0]; ?>" class="copy">Copy Web Link</a>


只是没有太多的运气让任何东西工作。


我正在使用zClip,并尝试使用 jQuery onClick 和数据属性来触发,如下所示。

但就是无法让它发挥作用。见小提琴

var copyText = 0;

$("a.copy").on('click', function () {

  var copyText = $(this).attr('data-copy');
  return false;

}).each(function () {

  $(this).zclip({

    path: 'http://zeroclipboard.googlecode.com/svn-history/r10/trunk/ZeroClipboard.swf',
    copy: copyText,
    beforeCopy: function () {

    },
    afterCopy: function () {

      alert(copyText + " has been copied!");

    }

  });

});


请在此处使用zClip jquery 插件查看我的新小提琴。

http://jsfiddle.net/Vr4Ky/5/


提前感谢您的任何建议。

4

2 回答 2

4

这是一个更新的演示,可以执行您尝试执行的操作:

使用这个(相同的)HTML:

<a href="#" data-copy="http://test.one.com/" class="copy">Copy Original Link</a>
<br />
<a href="#" data-copy="http://test.two.com/" class="copy">Copy Medium Link</a>
<br />
<a href="#" data-copy="http://test.three.com/" class="copy">Copy Web Link</a>

该脚本应该可以工作:

$("a.copy").on('click', function (e) {
  e.preventDefault();
}).each(function () {
  $(this).zclip({
    path: 'http://www.steamdev.com/zclip/js/ZeroClipboard.swf',
    copy: function() {
      return $(this).data('copy');
    }
  });
});

这就是我所做的。首先alert,您添加的 viaafterCopy实际上是默认设置,因此您无需为此添加额外的代码。属性也data-copy应该通过 jQuery 的data函数访问。最后,我将 SWF 引用与 JavaScript 放在同一主机上(根据 SWF 中的安全代码,这可能不是必需的,但似乎有必要让 jsfiddle 工作。

于 2013-01-09T19:16:16.733 回答
1

使用Jason Sperske解决方案,我找到了一种解决方法来解决在引导程序中使用时的问题。

这是如何让函数与引导下拉菜单一起使用。

$('.btn-group').addClass('open');
$("a.copy").on('click', function (e) {
  e.preventDefault();
}).each(function () {
  $(this).zclip({
    path: 'http://www.steamdev.com/zclip/js/ZeroClipboard.swf',
    copy: function() {
      return $(this).data('copy');
    }
  });
});
$('.btn-group').removeClass('open');

那么这个css也需要添加,停止flash文件绝对div定位在list元素之外。

.dropdown-menu li {
    position: relative;
}

见工作小提琴。http://jsfiddle.net/Vr4Ky/27/

于 2013-01-12T21:32:21.253 回答