前段时间在做微信h5的时候，遇到了ios兼容，使用clipboard.js插件完美解决

下载地址：下载地址： https://github.com/zenorocha/clipboard.js

cnd 引入js ： https://cdn.staticfile.org/clipboard.js/1.5.15/clipboard.min.js

html部分：

  1. <div id="foo">需要被粘贴的内容</div>
  2. <!-- 复制按钮 -->
  3. <a class="copyBtn"  href="javascript:"  data-clipboard-action="copy"  data-clipboard-target="#foo"></a>

js部分：

  1.  var clipboard = new Clipboard('.copyBtn').on('success', function(e) {
  2.         var e = e || window.event;
  3.         console.log('复制成功！！！');
  4.     }).on('error', function(e) {});

完整

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.   <meta charset="UTF-8">
  5.   <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.   <meta http-equiv="X-UA-Compatible" content="ie=edge">
  7.   <title>iOS复制兼容</title>
  8. </head>
  9. <body>
  10.     <div id="foo">需要被粘贴的内容</div>
  11.     <!-- 复制按钮 -->
  12.     <a class="copyBtn"  href="javascript:"  data-clipboard-action="copy"  data-clipboard-target="#foo"></a>
  13.   <script type="text/javascript" src="https://cdn.staticfile.org/clipboard.js/1.5.15/clipboard.min.js"></script>
  14.   <script>
  15.     window.onload = function(){
  16.       var clipboard = new Clipboard('.copyBtn').on('success', function(e) {
  17.         var e = e || window.event;
  18.         console.log('复制成功！！！');
  19.     }).on('error', function(e) {});
  20.   }
  21.   </script>
  22. </body>
  23. </html>

h5微信浏览器复制粘贴--ios兼容问题的解决方法（clipboard.js插件）的更多相关文章

  1. ios微信浏览器click事件不起作用的解决方法

    $(document).on( "click", ".weui_cell", function (event) {alert(); }); JS代码是这样的,h ...

  2. 微信浏览器发送ajax请求执行多次解决方法

    http://www.cnblogs.com/whatlonelytear/p/8934738.html

  3. 让微信内置浏览器兼容clipboard.js 复制粘贴 ios 安卓

    <!--js copy事件--><script type="text/javascript" src="/static/js/clipboard.min ...

  4. Clipboard 自动复制功能，ios复制失败，换方案 user-select: text ;长按复制 （ios 兼容，长按复制）

    Clipboard 自动复制功能,嵌套app内跳转的页面,ios 自动复制失败(该ios机子,微信,浏览器打开复制没有问题) 暂时换方案    user-select: text ;长按复制 (ios ...

  5. ZeroClipboard跨浏览器复制粘贴

    <!DOCTYPE html> <html> <head> <title>ZeroClipboard跨浏览器复制粘贴</title> < ...

  6. 在使用Ajax请求返回json数据的时候IE浏览器弹出下载保存对话框的解决方法

    在使用Ajax请求返回json数据的时候IE浏览器弹出下载保存对话框的解决方法 最近在做一个小东西,使用kindeditor上传图片的时候,自己写了一个上传的方法,按照协议规则通过ajax返回json ...

  7. 解决H5微信浏览器中audio兼容-- 背景音乐无法自动播放

    我们知道,ios 在safari浏览器中,audio标签不能在没有用户交互的情况下自动播放或有js直接控制播放,这是系统限制的一些原因. 但是背景音乐在微信浏览器可以设置自动播放,config配置一下 ...

  8. H5兼容问题及解决方法

    Meta基础知识: H5页面窗口自动调整到设备宽度,并禁止用户缩放页面 //一.HTML页面结构 <meta name="viewport" content="wi ...

  9. Web前端入门教程之浏览器兼容问题及解决方法

    JavaScript 被称为JS,是作为浏览器的内置脚本语言,为我们提供操控浏览器的能力,可以让网页呈现出各种特殊效果,为用户提供友好的互动体验.JS是Web前端入门教程中的重点和难点,而浏览器兼容性 ...

随机推荐

  1. java中String和int相互转换常用方法详解

    java中int和String的相互转换常用的几种方法: String  > int s="10";int i;第一种方法:i=Integer.parseInt(s);//默 ...

  2. Python入门基础(3 下)

    接着讲列表里面的一些操作吧 列表元素访问与计数 1.统计指定元素在列表中出现的次数使用count(),这就不必细说了,直接看代码,需要记住的是括号里面放的是元素 list = [1,5,5,5,5,8 ...

  3. 2017普及组D1T3 洛谷P3956 棋盘

    2017普及组D1T3 洛谷P3956 棋盘 原题 题目描述 有一个m×m的棋盘,棋盘上每一个格子可能是红色.黄色或没有任何颜色的.你现在要从棋盘的最左上角走到棋盘的最右下角. 任何一个时刻,你所站在 ...

  4. python基础认识(一)

    这些日子以来,新闻铺天盖地的都是人工智能,那么借着这股潮流,python也随之火起来了,现在的python不仅仅可以进行人工智能领域的开发.还可以进行web.爬虫等领域的运用.因此,我认为作为一个紧跟 ...

  5. 零基础ASP.NET Core WebAPI团队协作开发

    零基础ASP.NET Core WebAPI团队协作开发 相信大家对“前后端分离”和“微服务”这两个词应该是耳熟能详了.网上也有很多介绍这方面的文章,写的都很好.我这里提这个是因为接下来我要分享的内容 ...

  6. 异常——cmd下javac错误：编码GBK不可映射字符

    在看菜鸟教程时候用记事本创建文件,之后用notepad++编辑后,运行出现错误. 首先从信息上知道这是编码的问题了.开始试了下再notepad++上打开文件选择标签栏的“Encoding”中的“enc ...

  7. 20190127-Orleans与SF小伙伴的部分问答

    Orleans 怎么部署到服务器? 方式1:Orleans 服务端寄宿在Web应用中,将Web应用部署到服务器 方式2:通过SF/K8s部署到服务器 不同服务器上的谷仓和谷如何调配? 由Orleans ...

  8. asp core 配置用户密码验证

    using System; using System.Collections.Generic; using System.Linq; using System.Threading.Tasks; usi ...

  9. c实现生产者消费者问题。 windows下。

    #include <stdio.h>#include <windows.h> #define P(S) WaitForSingleObject(S,INFINITE)//定义W ...

  10. Java EE.JavaBean

    JavaBean是一组可移植.可重用.并可以组装到应用程序中的Java类.一个Model类(属性+构造函数).