Question

我和其他许多人一起浏览了这个网站，我无法在任何地方看到答案。

我目前有一个包含多个按钮和预览窗格的网站。预览窗格中显示的文本因用户当前悬停的按钮而异。

<body>
<div="preview_pane"> <!--ALL TEXT IS SHOWN HERE --> </div>

<div id="button_group">
   <div class="copy_me" id="stock1"></div> <!--THIS SHOWS STOCK TEXT-->
   <div class="copy_me" id="stock2"></div> <!--COMPLETELY DIFFERENT TEXT-->
   <div class="copy_me" id="stock3"></div> <!--YET SOME OTHER DIFFERENT TEXT-->
   <div class="copy_me" id="stock4"></div> <!--OTHER COMPLETELY DIFFERENT TEXT-->
</div>

</body>

我想要做的是让zeroclipboard在任何带有copy_me类的按钮上创建flash覆盖。所有这些按钮都需要复制预览窗格中显示的文本。

这样，当用户将鼠标悬停在按钮上时，预览窗格中的文本将会更改，然后当他们单击时，预览窗格中的文本将被复制到用户剪贴板。

我无法手动将脚本添加到每个按钮，因为将有超过50个库存文本按钮。

我没有flash或javascript的经验（只涉及jQuery）所以这对我来说是全新的。

非常感谢任何帮助。

Answer 1

在https://stackoverflow.com/a/26200988/3471658

回答了类似的问题

尝试使用http://www.steamdev.com/zclip/它允许您直接访问jquery，并且可以在return语句中使用自己的逻辑。

包括jquery.zclip.js 下载并保存ZeroClipboard.swf

这是一个片段：

$(".class-to-copy").zclip({
    path: "assets/js/ZeroClipboard.swf",
    copy: function(){
        return $(this).attr("data-attribute-with-text-to-copy");
    }
});

确保更改swf的路径。

Answer 2

我快速查看了zeroclipboard的api文档，我想使用glue方法，并传递一个dom节点数组。在这种情况下，您希望所有节点的类名为“copy_me”，因此：

var clip = new ZeroClipboard();
clip.glue(document.getElementsByClassName('copy_me'));

Answer 3

你提到了jQuery。这应该让你更容易：

var client = new ZeroClipboard($('.copy_me'));

请参阅： https://github.com/zeroclipboard/zeroclipboard/blob/master/docs/instructions.md

另见： http://jsfiddle.net/rimian/45Nnv/

Zeroclipboard，由class =“copy”的任何元素触发

3 个答案: