网址:https://clipboardjs.com/

使用方法:

1、引入js <script src="dist/clipboard.min.js"></script>

2、每一个需要复制或者操作的元素都需要new一个实例

3、三种方式实现复制

  • 复制input元素里内容,input不能隐藏,type不能设置为hidden,否则无效
<!-- Target -->
<input id="foo" value="https://github.com/zenorocha/clipboard.js.git"> <!-- Trigger -->
<button style="width:100px;height:50px" value="复制" data-clipboard-target="#foo">
</button>
var copyBtn= new ClipboardJS('.btn');
  • 直接将需要复制的元素写在button 中

    <button class="btn" data-clipboard-text="需要复制的内容">
    复制
    </button>
    var copyBtn= new ClipboardJS('.btn');
  • 写在代码中

   

<button class="btn" aria-label="需要复制的内容">
复制
</button>
var copyBtn= new ClipboardJS('.btn', {
text: function (trigger) {
return trigger.getAttribute('aria-label');
}
});

iphone只支持safari10+,有些移动端使用方式1,2无效时,可试试方式3

clipboard.js一个可以在移动端一键复制的插件的更多相关文章

  1. 使用clipboard.js实现复制内容至剪贴板

    下载插件 clipboard.js是不依赖flash,实现复制内容至剪贴板的js插件.下载clipboard.js的压缩包,根据需要选择dist目录下的压缩或未压缩版. github地址:https: ...

  2. 移动端无法复制:使用clipboard.js碰到的一个小问题

    移动端无法复制:使用clipboard.js碰到的一个小问题   直接看下面的代码:在移动端访问,点击,能正常复制. <html> <head> <meta http-e ...

  3. clipboard.js操作剪贴版——一些移动端交互和兼容经验

    https://github.com/zenorocha/clipboard.js 库,真的是个好库,而且不依赖flash,几乎完美支持移动端.但是,移动端应用有些不趟不知的小tip,这里归档下. 原 ...

  4. Clipboard.js : 移动端浏览器实现网页内容复制

    .bl { padding: 5px 10px; border-left: 3px solid #009a61; background: #f6f6f6; color: #555; font-size ...

  5. 解决clipboard.js在移动端复制失败的问题

    1.前沿 在项目中使用clipboard.js插件去实现点击按钮,复制一段网址到剪切板的功能.功能做好后,一开始无论这pc端还是移动端都能正常使用.突然某一天测出了一个bug:移动端复制失败,pc端是 ...

  6. 一款给力的一键复制js插件-clipboard.js

    一款没有依赖的.给力的一键复制的JS插件   点我前往github 案例demo见下载包内demo文件夹. 这里晒出最常用的几种方式,以供不时之需. <!DOCTYPE html> < ...

  7. 前端技术之:如何在Vue中使用clipboard.js复制服务端数据

    第一步 创建点击对象页面元素,并绑定业务数据. <el-button type="text" size="mini" class="copy-b ...

  8. 使用clipboard.js复制页面内容到剪切板

    最近在做一个的智能客服Web端浏览器应用,其中有一项需求是客户在获取系统返回的 答案后点击“复制答案”按钮将答案复制到系统剪切板.本以为这是一个小case,但是发现如果 要对各种主流浏览器都有良好的兼 ...

  9. clipboard.js兼容ios

    再使用clipboard.js做项目时,项目需求是在非input,button等可以点击的标签(span,p,div)上实现点击来复制内容,在PC端和移动端android没问题,但是到了ios毫无反应 ...

随机推荐

  1. 2017-12-19python全栈9期第四天第二节之列表的增删改查之切片

    #!/user/bin/python# -*- coding:utf-8 -*-li = ['zd',[1,3,4,5,6],'ls','ww','zl']l1 = li[0]print(l1)l2 ...

  2. Neo4j 第一篇:在Windows环境中安装Neo4j

    图形数据库(Graph Database)是NoSQL数据库家族中特殊的存在,用于存储丰富的关系数据,Neo4j 是目前最流行的图形数据库,支持完整的事务,在属性图中,图是由顶点(Vertex),边( ...

  3. Pandas系列(十三)-其他常用功能

    一.统计数据频率 1. values_counts pd.value_counts(df.column_name) df.column_name.value_counts() Series.value ...

  4. NOI-OJ 2.2 ID:1696 逆波兰表达式

    思路 很容易看出规律,一个运算符出现,其后就一定需要左值和右值,而左值和右值有可能还是运算符,这就需要继续递归.递归终止的条件就是遇到数字. 逆波兰表达式其实是构造成了一颗二叉树 例程 #includ ...

  5. 如何解决failed to push some refs to git

    $ git push -u origin master To git@github.com:yangchao0718/cocos2d.git ! [rejected]        master -& ...

  6. SSRF漏洞挖掘经验

    SSRF概述 SSRF(Server-Side Request Forgery:服务器端请求伪造) 是一种由攻击者构造形成由服务端发起请求的一个安全漏洞.一般情况下,SSRF攻击的目标是从外网无法访问 ...

  7. frame的用法

    <iframe> 标签规定一个内联框架.一个内联框架被用来在当前 HTML 文档中嵌入另一个文档. 所有的主流浏览器都支持<iframe>标签.你可以把提示的文字放到 < ...

  8. 忘记mysql的登陆密码该怎么办?

    1.如果忘记了其他用户的密码,可以使用root账户进入mysql,修改mysql.user表中的用户密码 2.如果忘记了root的mysql密码,可以使用如下方式: 确认服务器处于安全的状态,也就是没 ...

  9. java 面经

    1.什么是Java虚拟机(JVM)?为什么Java被称作是“平台无关的编程语言”? Java虚拟机是一个可以执行Java字节码的虚拟机进程.Java源文件被编译成能被Java虚拟机执行的字节码文件. ...

  10. 一些日期的计算方式 PHP

    一些日期的计算 某个月内的所有天数: public function getMonthDay ($date) { $stattime = strtotime(date('Ym01',strtotime ...