js实现点击后将文字或图片复制到剪贴板的方法


Posted in Javascript onAugust 04, 2014

本文实例讲述了js实现点击后将文字或图片复制到剪贴板的方法,代码非常简洁实用,具体功能代码如下所示:

实现复制文字代码:

<table width="99%" border="0" cellpadding="0" cellspacing="0" class="firtable"> 
  <tr> 
  <th width="100%" style="color: white;"><s:text name="询单明细"></s:text></th> 
  </tr> 
 <tr> 
  <td align="center">  
   <textarea name="inquiryContact1" id="inquiryContact1" rows="15" cols="60" readonly="readonly"></textarea> 
    <div id="inquiryInfoDIV" style="display:none"> 
      <s:property value="inquiryContact" escape="false"/> 
    </div> 
    <script>     dojo.byId("inquiryContact1").innerText=dojo.byId("inquiryInfoDIV").innerText; 
   </script> 
  </td> </tr> 
 <tr> 
  <td align="center"> 
   <input type="button" id="button" name="button" value="复制" onclick="copyContact()"/> 
  </td> </tr> </table> 
 

<script type="text/javascript"> 
  var i = 0 ;  
  function copyContact(){ 
    var contat = document.getElementById("inquiryContact1").value; 
    window.clipboardData.setData('text', contat); 
    if(window.clipboardData.getData('text')==''){ 
      if(i==1){ 
        alert("复制失败,请手动Ctrl+C快捷键复制!"); 
      }else{ 
        alert("复制失败,请重新复制!"); 
        i = 1; 
      } 
    }else{ 
       alert("内容已经复制到剪贴板!"); 
    } 
  } 
</script>

实现复制图片代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Insert title here</title> 
<SCRIPT LANGUAGE="JScript"> 
var oPopup = window.createPopup(); 
function ButtonClick(div) 
{ 
//var div = document.getElementById('divId'); 
div.contentEditable = 'true'; 
var controlRange; 
if (document.body.createControlRange) { 
controlRange = document.body.createControlRange(); 
controlRange.addElement(div); 
controlRange.execCommand('Copy'); 
} 
div.contentEditable = 'false'; 
} 
</SCRIPT> 
</head> 
<body> 
  <div id="divId1"> 
    <img src="F:/2012070518474964.jpg" onclick="ButtonClick(this)"> 
  </div> 
</BODY> 
</body> 
</html>

感兴趣的读者可以测试自己测试一下代码,或者对其功能进行修改和完善!

Javascript 相关文章推荐
Javascript异步编程的4种方法让你写出更出色的程序
Jan 17 Javascript
js如何判断不同系统的浏览器类型
Oct 28 Javascript
javascript定义变量时带var与不带var的区别分析
Jan 12 Javascript
JS获取表格内指定单元格html内容的方法
Mar 31 Javascript
浅谈关于JavaScript API设计的一些建议和准则
Jun 24 Javascript
js判断日期时间有效性的方法
Oct 24 Javascript
jQuery qrcode生成二维码的方法
Apr 03 Javascript
js遍历获取表格内数据的方法(必看)
Apr 06 Javascript
javascript内存分配原理实例分析
Apr 10 Javascript
除Console.log()外更多的Javascript调试命令
Jan 24 Javascript
js+canvas实现滑动拼图验证码功能
Mar 26 Javascript
vue实现下载文件流完整前后端代码
Nov 17 Vue.js
JavaScript中的函数重载深入理解
Aug 04 #Javascript
window.print打印指定div指定网页指定区域的方法
Aug 04 #Javascript
jQuery 删除或是清空某个HTML元素示例
Aug 04 #Javascript
js实现正方形颜色从下往上升的效果
Aug 04 #Javascript
与Math.pow 相反的函数使用介绍
Aug 04 #Javascript
简单易用的倒计时js代码
Aug 04 #Javascript
javascript中with()方法的语法格式及使用
Aug 04 #Javascript
You might like
支持数组的ADDSLASHES的php函数
2010/02/16 PHP
很让人受教的 提高php代码质量36计
2012/09/05 PHP
解决Codeigniter不能上传rar和zip压缩包问题
2014/03/07 PHP
php计算title标题相似比的方法
2015/07/29 PHP
Visual Studio中的jQuery智能提示设置方法
2010/03/27 Javascript
js各种验证文本框输入格式(正则表达式)
2010/10/22 Javascript
Jquery 一次处理多个ajax请求的代码
2011/09/02 Javascript
获取body标签的两种方法
2011/10/13 Javascript
javascript学习笔记(十六) 系统对话框(alert、confirm、prompt)
2012/06/20 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(一)让静态人物动起来
2013/01/23 Javascript
extjs3 combobox取value和text案例详解
2013/02/06 Javascript
js点击出现悬浮窗效果不使用JQuery插件
2014/01/20 Javascript
jquery引用方法时传递参数原理分析
2014/10/13 Javascript
Clipboard.js 无需Flash的JavaScript复制粘贴库
2015/10/02 Javascript
jQuery 更改checkbox的状态,无效的解决方法
2016/07/22 Javascript
浅析JavaScriptSerializer类的序列化与反序列化
2016/11/22 Javascript
移动端脚本框架Hammer.js
2016/12/15 Javascript
AngularJs上传前预览图片的实例代码
2017/01/20 Javascript
bootstrap Validator 模态框、jsp、表单验证 Ajax提交功能
2017/02/17 Javascript
基于JS实现9种不同的面包屑和分布式多步骤导航效果
2017/02/21 Javascript
Vue.js中轻松解决v-for执行出错的三个方案
2017/06/09 Javascript
react-router JS 控制路由跳转实例
2017/06/15 Javascript
使用ThinkJs搭建微信中控服务的实现方法
2019/08/08 Javascript
Python配置文件解析模块ConfigParser使用实例
2015/04/13 Python
在Python的Flask中使用WTForms表单框架的基础教程
2016/06/07 Python
Python 专题二 条件语句和循环语句的基础知识
2017/03/19 Python
运行django项目指定IP和端口的方法
2018/05/14 Python
Windows 64位下python3安装nltk模块
2018/09/19 Python
Python数据可视化处理库PyEcharts柱状图,饼图,线性图,词云图常用实例详解
2020/02/10 Python
python学习将数据写入文件并保存方法
2020/06/07 Python
python实现斗地主分牌洗牌
2020/06/22 Python
Python自动化办公Excel模块openpyxl原理及用法解析
2020/11/05 Python
如何创建一个Flask项目并进行简单配置
2020/11/18 Python
selenium+headless chrome爬虫的实现示例
2021/01/08 Python
delegate与普通函数的区别
2014/01/22 面试题
给校长的建议书范文
2015/09/14 职场文书