前段时间在做微信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. Hash的应用2

    代码: #include <stdio.h> #define OFFSET 500000//偏移量 ];//记录每个数是否出现,出现为1,不出现为0 int main(){ int n,m ...

  2. C语言指针使用不当带来的内存不可读

    前几天遇到一个C语言初学者提到的一个问题,代码我做了一些修改,如下: #include <stdio.h> #include <string.h> int main(void) ...

  3. Socket编程(C语言实现):bind()函数英文翻译

    本篇翻译的bind()函数,我参考的国外网站是: bind 朋友们可以自由转载我对英文的中文翻译,但是对于"作者注:"的描述,转载时请注明出处和作者,否则视为侵权. 下面是翻译的正 ...

  4. Hadoop FAQ

    测试环境: Hadoop 2.6.0-cdh5.7.1 apache-kylin-2.0.0-bin kylin运行check-env.sh时,报如下警告: WARN util.NativeCodeL ...

  5. 如何使用百度EasyDL进行情感分析

    使用百度EasyDL定制化训练和服务平台有一段时间了,越来越能体会到EasyDL的易用性.在此之前我也接触过不少的深度学习平台,如类脑平台.Google的GCP深度学习平台.AWS深度学习平台,但我觉 ...

  6. NOIP2018初赛题解 提高组

  7. Flutter学习笔记(9)--组件Widget

    如需转载,请注明出处:Flutter学习笔记(9)--组件Widget 在Flutter中,所有的显示都是Widget,Widget是一切的基础,我们可以通过修改数据,再用setState设置数据(调 ...

  8. CVE-2018-4407 漏洞复现POC

    pip install scapy import scapy from scapy.all import * send(IP(dst="192.168.1.132",options ...

  9. Shell学习心得(四):流程控制

    一.if else 1. if if 语句语法格式: if condition then command1 command2 ... commandN fi 写成一行(适用于终端命令提示符): ]; ...

  10. 网络框架,互联网的组成,OSI七层协议,抽象层

    6.25自我总结 1.网络框架 1.单机 单机游戏 以下两个基于网络的 2.CS架构 cs--->client客户/server服务 服务端(应用程序)一个就够了,客户端(应用程序)可以有多个 ...