【zeroclipboard】复制到剪切板小功能

最新推荐文章于 2021-06-21 23:21:33 发布

lihuapiao

最新推荐文章于 2021-06-21 23:21:33 发布

阅读量642

点赞数

分类专栏： Web前端文章标签： jquery javaweb zclipboard

本文链接：https://blog.csdn.net/lihuapiao/article/details/47865217

版权

Web前端专栏收录该内容

9 篇文章 0 订阅

订阅专栏

这里使用的是用Zero Clipboard类库封装的插件，它是利用flash进行复制完成功能的。官方的阐述如下：zClip is a lightweight jQuery "copy to clipboard" plugin built using the popular Zero Clipboard library. This plugin uses an invisible Adobe Flash movie that is fully compatible with Flash Player 10 and below.

js和swf下载地址：点击打开链接

使用方法：

在项目中引入zeroclipboard所需要的js和swf

引用js:

<script type="text/javascript" src="${contextPath}/public/js/zclipboard/ZeroClipboard.min.js"></script>

<script type="text/javascript" >
        window.contextPath = '${contextPath}';
 </script>

引用函数：

<script type="text/javascript" >
$(function(){
    var clip = new ZeroClipboard(document.getElementById("<span style="color:#FF0000;">zclipboard_copy</span>"),{
        moviePath: "ZeroClipboard.swf"
    });
})
 </script>

jsp页面中的标签条件：

<span id="<span style="background-color: rgb(0, 153, 0);">enterprise_name</span>">要复制的文字</span><a href="#" id="<span style="color:#FF0000;">zclipboard_copy</span>" data-clipboard-target="<strong><span style="color:#009900;">enterprise_name</span></strong>">复制</a>

这里最重要的属性是 data-clipboard-target,值为要复制内容的id