javascript复制内容到剪切板/网页上的复制按钮的实现:DEMO如下

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>复制内容到剪切板</title>
<script>
function copy(){
document.getElementById("content").select();//选中要复制的内容,这里用input标签可以,用div标签不行,估计是只能用表单标签,具体没测试过
document..execCommand("Copy"); //执行浏览器复制命令
}
</script>
</head> <body>
<input id="content" value="待复制的内容">
<button onClick="copy();">复制</button>
</body>
</html>

javascript复制内容到剪切板/网页上的复制按钮的实现的更多相关文章

  1. JS禁止右键查看源码,禁止复制,复制内容到剪切板

    有时候我们希望自己的网页源码不被查看,这时需要关掉鼠标的右击事件;有时候我们也希望禁止选择页面内容Ctrl+C复制. 1.禁止右键查看源码; <script> //设置右键事件 funct ...

  2. js复制内容到剪切板

    注意第一部分的内容不兼容Safari,全兼容的请使用第二部分方法 第一部分 查看demo请点  这里. 原生js复制指定内容到剪切板,超简单的实现方式, 实现思路如下: 1.创建一个input,把想要 ...

  3. 简单实现兼容各大浏览器的js复制内容到剪切板

    因为网站文章需要提供几个按钮,单击后实现复制文章内容到剪贴板. 在网上搜索了很多内容,发现都比较乱这里自己整理下,分享给大家 效果图如下: 之前使用的是window.clipboardData.set ...

  4. 在多浏览器使用JS复制内容到剪切板,无需插件

    最近在学习DHTMLX,下载了一些JS源码,使用谷歌浏览器,在学习dhtmlxGrid部分进行复制表格内容时,发现,在线版的可以复制成功,而本地的不可以复制,报类似访问剪切板错误,经查找原因,原来是谷 ...

  5. js复制内容到剪切板,兼容pc和手机端,支持Safari浏览器

      最近,一些项目中用到监听用户复制.剪切的操作. 案例1.在PC端,当用户获得一个京东卡的使用券,当用户使用ctrl + C复制得到的使用券时,将使用券的代号复制到粘贴板,以便于用户ctrl+v进行 ...

  6. js实现复制内容到剪切板,兼容pc和手机端,支持Safari浏览器

    Javascript原生有一些事件:copy.paste.cut, 这些事件可以作用的目标元素: 能获得焦点的元素 (如contentEditable内容能编辑或者可以选中的元素),或者是<bo ...

  7. 兼容安卓和ios实现一键复制内容到剪切板

    实现代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <m ...

  8. 原生js 复制内容到剪切板

    代码: function copyHandle(content){ let copy = (e)=>{ e.preventDefault() e.clipboardData.setData('t ...

  9. jQuery-zclip实现复制内容到剪切板

    jQuery-zclip是一个复制内容到剪贴板的jQuery插件,使用它我们不用考虑不同浏览器和浏览器版本之间的兼容问题.jQuery-zclip插件需要Flash的支持,使用时记得安装Adobe F ...

随机推荐

  1. 2016 Multi-University Training Contest 7 solutions BY SYSU

    Ants 首先求出每个点的最近点. 可以直接对所有点构造kd树,然后在kd树上查询除本身以外的最近点,因为对所有点都求一次,所以不用担心退化. 也可以用分治做,同样是O(NlogN)的复杂度. 方法是 ...

  2. [Usaco2007 Oct] Super Paintball超级弹珠

    Time Limit: 5 Sec  Memory Limit: 64 MBSubmit: 489  Solved: 384[Submit][Status][Discuss] Description ...

  3. angularjs ngRoute的使用简单例子

    很丑的小例子,刚学angularjs,写下来方面以后看. 1.例子的工程目录如下: 2.index.html代码如下: <!DOCTYPE html><html><hea ...

  4. Maven新建webapp项目报错Could not resolve artifact org.apache.maven.archetypes:maven-archetype-webapp:pom:RELEASE

    Windows-Preferences 在搜索框输入maven,点击下面的Archetypes--->Add Remote Catalog... 对应输入 http://repo1.maven. ...

  5. HTML DOM对象的属性和方法介绍(原生JS方法)

    HTML DOM对象的属性和方法介绍 DOM 是 Document Object Model(文档对象模型)的缩写. DOM(文档对象模型)是针对HTML和XML文档的一个API(应用程序编程接口), ...

  6. Nexus搭建Maven私有仓库

    原文:http://blog.csdn.net/rickyit/article/details/54927101 前言 Nexus Repository Manager is a Javaapplic ...

  7. Go --- 设计模式(工厂模式)

    简易工厂主要是用来解决对象“创建”的问题.以下的例子取自<大话设计模式>中第一章,实现一个可扩展的“计算器”.当增加新的功能时,并不需改动原来已经实现的算法.由于是简易工厂,所以我们还是需 ...

  8. webservice0基础

    在学习webservice的时候,常常将ns和url花了好久时间才理解过来,这里备份下. 首先定义接口: @WebService public interface IService { @WebRes ...

  9. JSP中的编译指令和动作指令的差别

    JSP中的编译指令和动作指令的差别 1.编译指令是通知Servlet引擎的处理消息.而动作指令仅仅是执行时的脚本动作 2.编译指令是在将JSP编译成Servlet时起作用,而动作指令可替换成JSP脚本 ...

  10. LoadRunner 比较字符串是否相等

    int strcmp ( const char *string1, const char *string2 );大小写敏感.int stricmp ( const char *string1, con ...