文档章节

jQuery-zclip实现复制内容到剪切板

zhiqiangw
 zhiqiangw
发布于 2017/09/05 21:30
字数 237
阅读 19
收藏 1

下载jq框架

下载地址:http://jquery.com/

下载jquery.zclip文件

下载地址:https://github.com/patricklodder/jquery-zclip

下载layui框架

下载地址:http://www.layui.com/

<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 
<script type="text/javascript" src="jquery.zclip.min.js"></script> 

正确引入之后进行方法调用

<span id="link" style="display: none;">https://my.oschina.net/zhiqiangwang/blog</span>
<span class="tpl-label-info" id="copyBtn"  > 提取链接</span>

<script> 
    $('#copyBtn').zclip({ 
        path: "ZeroClipboard.swf", 
        
        copy: function(){ 
        	return $('#link').html(); 
        },
        beforeCopy:function(){
           /* 按住鼠标时的操作 */
        },
  		afterCopy:function(){/* 复制成功后的操作 */
  			layer.msg('复制成功');
  		}
    }); 
</script>

选项

选项 默认值 描述
路径 'ZeroClipboard.swf' 通往ZeroClipboard.swf的路径
复制 null 要复制的字符串或返回要复制的字符串的函数
afterCopy null 复制后执行的功能
beforeCopy null 复制前执行的功能
clickAfter true 将点击事件中继到复制后绑定的元素
setHandCursor true 将光标设置为指针
setCSSEffects true 添加hoveractive类到绑定到的元素

© 著作权归作者所有

共有 人打赏支持
zhiqiangw
粉丝 12
博文 193
码字总数 142652
作品 0
郑州
程序员
jquery+flash(zclip)实现点击复制到剪切板

jQuery-zclip是一个复制内容到剪贴板的jQuery插件,使用它我们不用考虑不同浏览器和浏览器版本之间的兼容问题。jQuery-zclip插件需要Flash的支持,使用时记得电脑安装Adobe Flash Player。 ...

东子
2014/09/20
0
2
JAVASCRIPT复制到剪贴板

来源:我的博客 最近答应张先生替 42qu 写一个短址服务,写的过程中学到若干新东西,JS操作剪贴板便是其中一例。 Javascript本身当然提供了操作剪贴板的接口,一般长得像 function copyToCli...

何世友
2012/01/17
0
0
【js】js访问剪切板(兼容各大浏览器)唯一解决方案ZeroClipboard.swf

需求描述: 通过JS实现将页面中的某个元素的数据复制到剪切板上。 需求分析: 要用JS实现最大的问题就是浏览器的兼容性问题了。而且最大的问题还是浏览器出于安全型的考虑,所以像chrome,F...

666B
2014/08/12
0
0
关于js复制到剪贴板的处理方法

项目最开始引用了copy的方法,只支持ie和火狐,对其他的浏览器不兼容,后来在网上刨了刨.发现了终极解决办法,zclip,这个完美兼容疙各大浏览器复制到剪贴板,引入了swf的文件。调了一个小时,...

范思哲思考者
2014/04/13
0
0
Zero Clipboard-js复制到剪切板(支持多浏览器)

在前端开发中经常会遇到这样的问题,要求用js将输入框或者div中的内容复制到剪切板。在ie下可以通过clipboardData.setData来实现,但是这个方法却不能兼容其他的浏览器。显然这种方法在这个浏...

mickelfeng
2014/01/22
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

Nginx防盗链、访问控制、Nginx解析PHP相关配置、Nginx代理

Nginx防盗链 在配置文件里写入以下内容: 用curl测试 访问控制 Nginx限制某些IP不能访问或者只允许某些IP访问。 配置文件写入如下内容: allow 表示允许访问的IP,deny限制访问的IP。 匹配正...

黄昏残影
18分钟前
0
0
自己动手实现RPC服务调用框架

转载 TCP的RPC 引言 本文利用java自带的socket编程实现了一个简单的rpc调用框架,由两个工程组成分别名为battercake-provider(服务提供者)、battercake-consumer(服务调用者)。 设计思路...

雨中漫步的鱼
21分钟前
0
0
Centos6.x安装之后的9件事

Centos6.x安装之后的9件事 这些不是必须都做的,只不过是我个人的习惯,在此记录一下。 1.修改yum源到国内 CentOS系统更换软件安装源 备份你的原镜像文件,以免出错后可以恢复。 mv /etc/yu...

叶云轩
26分钟前
6
0
springboot2 使用jsp NoHandlerFoundException

开发图片上传功能,为验证测试功能是否正常,使用JSP编写表单提交进行测试 开发完成后,请求API提示如下异常: No mapping found for HTTP request with URI [/WEB-INF/jsp/avatar_upload.j...

showlike
32分钟前
0
0
springboot踩坑记--springboot正常启动但访问404

一 spring boot的启动类不能直接放在main(src.java.main)这个包下面,把它放在有包的里面就可以了。 二 正常启动了,但是我写了一个controller ,用的@RestController 注解去配置的controlle...

onedotdot
33分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部