前段时间在做微信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部分：

<div id="foo">需要被粘贴的内容</div>

<!-- 复制按钮 -->

<a class="copyBtn"  href="javascript:"  data-clipboard-action="copy"  data-clipboard-target="#foo"></a>

js部分：

 var clipboard = new Clipboard('.copyBtn').on('success', function(e) {

        var e = e || window.event;

        console.log('复制成功！！！');

    }).on('error', function(e) {});

完整

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <meta http-equiv="X-UA-Compatible" content="ie=edge">

  <title>iOS复制兼容</title>

</head>

<body>

    <div id="foo">需要被粘贴的内容</div>

    <!-- 复制按钮 -->

    <a class="copyBtn"  href="javascript:"  data-clipboard-action="copy"  data-clipboard-target="#foo"></a>

  <script type="text/javascript" src="https://cdn.staticfile.org/clipboard.js/1.5.15/clipboard.min.js"></script>

  <script>

    window.onload = function(){

      var clipboard = new Clipboard('.copyBtn').on('success', function(e) {

        var e = e || window.event;

        console.log('复制成功！！！');

    }).on('error', function(e) {});

  }

  </script>

</body>

</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. C++学习书籍推荐《Effective C++ 第三版（英文)》下载

    百度云及其他网盘下载地址:点我 作者简介 Scott Meyers is one of the world's foremost authorities on C++, providing train ...

  2. 使用wincc vbs脚本查找进程及如何运行进程

    使用vbs代码查看某个进程是否在运行,本文要检查的进程名为 QRscan.exe,其代码如下: sub CheckProcess Dim WMI,Objs,Process,ObjSet WMI=Get ...

  3. 跨站脚本攻击（selfxss）笔记（三）

    本篇纯文字发表自己对自插型xss的看法 selfxss,顾名思义,自己输入xss脚本,输出仅自己看到,仅xss到自己. 常见的有:查询框的xss.某个账号中,添加自己的分组类等 查询框的xss: 即在 ...

  4. 最好的导航分割栏，分割线，实现底部透明，纯css

    <div class="Ui_Ct_Line padding_5"> <div>为您推荐</div> </div> .Ui_Ct_L ...

  5. Spring mybatis 之-ssm框架环境搭建（方案一）

    SSM框架- S-Spring  S-Spring mvc M-mybatis  就需要以下几个配置文件,放在resources文件夹下面: db.properties 放的是数据库连接池的配置文件, ...

  6. 个人永久性免费-Excel催化剂功能第49波-标准数据结构表转报表样式结果

    中国的企业信息化,已经过去了20年,企业里也产生了大量的数据,IT技术的信息化管理辅助企业经营管理也已经得到广泛地认同,现在就连一个小卖部都可以有收银系统这样的信息化管理介入.但同时也有一个很现实的问 ...

  7. [leetcode] 456. 132 Pattern (Medium)

    对一个三个元素以上的数组,如果存在1-3-2模式的组合,则返回true. 1-3-2模式就是值的排序是i<k<j但是下标排序是i<j<k. 解法一: 硬解,利用一个变量存储是否 ...

  8. [leetcode] #239 Sliding Window Maximum (Hard)

    原题链接 题意: 给定一个数组数字,有一个大小为k的滑动窗口,它从数组的最左边移动到最右边.你只能在窗口看到k个数字.每次滑动窗口向右移动一个位置. 记录每一次窗口内的最大值,返回记录的值. 思路: ...

  9. vue教程(五)--路由router介绍

    一.html页面中如何使用 1.引入 vue-router.js 2.安装插件 Vue.use(VueRouter) 3.创建路由对象 var router = new VueRouter({ // ...

  10. Python实现性能自动化测试竟然如此简单

    一.思考❓❔ 1.什么是性能自动化测试? 性能 系统负载能力 超负荷运行下的稳定性 系统瓶颈 自动化测试 使用程序代替手工 提升测试效率 性能自动化 使用代码模拟大批量用户 让用户并发请求 多页面多用 ...