在实现功能时写的一个小demo，可以实现点击复制内容（任何你需要copy的文字内容data）。

　　经测试，可兼容 chrome, edge, firefox, ie, opera, safari，至于版本的话肯定是有限制的，你可以尝试一下版本的底线。

　　下面就是demo，你可以使用在任何地方。

 <!DOCTYPE html>

 <html>

 <head>

     <meta charset="utf-8">

     <title>js实现copy</title>

 </head>

 <body>

     <div>

         <span>阳光总在风雨后。</span>

     </div>

     <input type="text" name="" placeholder="请粘贴测试">

 <script type="text/javascript">

     (function(){

         var span = document.getElementsByTagName('span')[0];

         span.addEventListener('click', function(event){

             var t, p, i;

             t = event.target || event.srcElement;             p = t.parentNode;

             i = document.createElement('input');

             i.width = 0;

             i.height = 0;

             i.value = t.innerText;

             p.appendChild(i);

             i.focus();

             i.setSelectionRange(0, i.value.length);

             document.execCommand('copy', true);

             p.removeChild(i);

         },false);

     })();

 </script>

 </body>

 </html>

　　哦，对了，如果是IE的话，你应该用IE的事件处理程序attachEvent。

　　谢谢你的浏览，如果觉得不错，请点赞TT。

js实现点击copy，可兼容的更多相关文章

  1. js 实现点击复制文本内容

    js  实现点击复制文本内容 <table> <tr><td>姓名:<span onclick="copyContent(this);" ...

  2. 源生JS实现点击复制功能

    之前在工作中,有位同事问过我一个问题,JS如何实现点击复制功能.给他解决后现在来总结归纳一下,顺便做个笔记. PS:此乃本人第一篇博客(跟着同事大佬学习),涉及知识尚浅,如有任何意见和建议请告知于我. ...

  3. js中getBoundingClientRect的作用及兼容方案

    js中getBoundingClientRect的作用及兼容方案 1.getBoundingClientRect的作用 getBoundingClientRect用于获取某个html元素相对于视窗的位 ...

  4. js本地图片预览代码兼容所有浏览器

    html代码 <div id="divPreview" style="width: 160px; height: 170px"><img id ...

  5. css+js整站变灰（兼容IE7+）

    原文:css+js整站变灰(兼容IE7+) 历年大型地震等自然灾害来临过后,各大网站整站都变成灰色以悼念逝去的生命,那么这种整站变灰的效果是怎么做到的? 重写一套css?NO,即便你有这个时间重写,那 ...

  6. 基于原生js的返回顶部组件，兼容主流浏览器

    基于原生js的返回顶部插件,兼容IE8及以上.FF.chrome等主流浏览器. js文件中封装了getScrollTop()和changeScrollTop()函数分别用于获取滚动条滚动的高度和修改滚 ...

  7. js模拟点击事件实现代码

    js模拟点击事件实现代码 类型:转载 时间:2012-11-06 在实际的应用开发中,我们会常常用到JS的模事件,比如说点击事件,举个简单的例子,点击表单外的"提交"按钮来提交表单 ...

  8. 重写JS的鼠标右键点击菜单

    重写JS的鼠标右键点击菜单 该效果主要有三点,一是对重写的下拉菜单的隐藏和显示:二是屏蔽默认的鼠标右键事件:三是鼠标左键点击页面下拉菜单隐藏. 不多说,上html代码: 1 <ul id=&qu ...

  9. JS控制CSS3，添加浏览器兼容前缀

    不同浏览器对于有些css3属性名字定义的时候,会带上特有的前缀,所以在css编写的时候,经常会一个属性写多个不同的前缀进行兼容.比如: div { transform: rotate(30deg); ...

随机推荐

  1. luogu 1521-求逆序对

    题意: 逆序对指在一个序列中ai>aj && i < j,也就是一前一后两个数,当大的在前面的时候即算一对. 题目求在一个由1-n组成的序列中逆序对为k的序列的个数. 出题 ...

  2. IOS开发常用的基础方法

    .//退出键盘 [self.view endEditing:YES]; 隐藏手机上方的状态栏 -(BOOL)prefersStatusBarHidden{ return YES; } //获取当前控制 ...

  3. OC中@class的使用

    作用: 可以简单地引用一个类简单使用@class Dog; //类的引入 #import "Dog.h"仅仅是告诉编译器:Dog是一个类;并不会包含Dog这个类的所有内容 具体使用 ...

  4. Centos程序最小化后，窗口标签都消失找不到窗口的问题

    我是用的centos版本是CentOs 7. 在“顶部面板”或者 “底部面板” 右击选择“添加组件”),如下图所示: 在搜索框里输入“窗口列表”(window list),选中“窗口列表”即可.如下图 ...

  5. 无分类编址（CIDR）构成超网

    CIDR(无分类域间路由选择) CIDR最主要有两个以下特点: 消除传统的A,B,C地址和划分子网的概念,更有效的分配IPv4的地址空间,CIDR使IP地址又回到无分类的两级编码.记法:IP地址::= ...

  6. 一个简单易用的容器管理平台-Humpback

    什么是Humpback? 在回答这个问题前,我们得先了解下什么的 Docker(哦,现在叫 Moby,文中还是继续称 Docker). 在 Docker-百度百科 中,对 Docker 已经解释得很清 ...

  7. 【2017-05-18】WebForm的Repeater控件和一些简单控件

    一.Repeater控件 1. <%@ %> - 这里面写一些声明和引用的 <%  %> - 编写C#代码的 <%= %> - 往界面上输出一个变量的值 <% ...

  8. 原生JS Ajax 请求

    var username = document.getElementById('username').value; var password = document.getElementById('pa ...

  9. c# .net core 下的网络请求

    本文章是在VS2017的环境下,.net core 1.1版本以上. 在这期间,由于.net core 并不基于IIS,我们的过去的网络请求代码在.net core框架下,有可能会出现不兼容,报错的现 ...

  10. C# 关于操作datatable的列名和删除某一列的数据

    1.获取一个数据集表 DataTable dt = selectDEGS(type, words, KUser); 2.删除某一列 dt.Columns.Remove("TaskID&quo ...