js实现点击图片将图片地址复制到粘贴板的方法


Posted in Javascript onFebruary 16, 2015

本文实例讲述了js实现点击图片将图片地址复制到粘贴板的方法。分享给大家供大家参考。具体如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta name="robots" content="all" />

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>点击图片直接把图片地址复制到粘贴板</title>

<style type="text/css">

 #www_3water_net_hidden {

  position:absolute;

  visibility:hidden;

 }

 img {

  cursor:pointer ;

 }

</style>

</head>

<body>

点击下面的图片直接获取得地址。

 <div id="3water_net">

  <img src="images/m10.jpg"><br />

 </div>

 <span id="www_3water_net_hidden"></span>

</body>

<script type="text/javascript">

<!--

 $id=function(id) {

  return document.getElementById(id);

 }

 var objs =$id("3water_net").getElementsByTagName("img") ;

 for (var i=0;i<objs.length;i++ ) {

  objs[i].onclick=function () {

   $id("www_3water_net_hidden").innerHTML=this.src ;

   var my_range =document.body.createTextRange() ;

   my_range.moveToElementText($id("www_3water_net_hidden"));

   my_range.execCommand("copy");

   alert("图片地址已经复制到剪贴板");

   return false ;

  }

 }

//-->

</script>

</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
JavaScript 事件参考手册
Dec 24 Javascript
读jQuery之七 判断点击了鼠标哪个键的代码
Jun 21 Javascript
EasyUI实现二级页面的内容勾选的方法
Mar 01 Javascript
jQuery siblings()用法实例详解
Apr 26 Javascript
Angular中使用ui router实现系统权限控制及开发遇到问题
Sep 23 Javascript
jQuery窗口拖动功能的实现代码
Feb 04 Javascript
JS返回顶部实例代码
Aug 09 Javascript
解决vue中post方式提交数据后台无法接收的问题
Aug 11 Javascript
微信小程序实现单选选项卡切换效果
Jun 19 Javascript
微信小程序连接服务器展示MQTT数据信息的实现
Jul 14 Javascript
jQuery+ajax实现文件上传功能
Dec 22 jQuery
vue组件vue-esign实现电子签名
Apr 21 Vue.js
js实现鼠标经过时图片滚动停止的方法
Feb 16 #Javascript
js鼠标点击图片实现随机变换图片的方法
Feb 16 #Javascript
JavaScript简介
Feb 15 #Javascript
JavaScript的原型继承详解
Feb 15 #Javascript
javascript 闭包详解
Feb 15 #Javascript
PhotoShop给图片自动添加边框及EXIF信息的JS脚本
Feb 15 #Javascript
浅析javascript中函数声明和函数表达式的区别
Feb 15 #Javascript
You might like
PHP5中Cookie与 Session使用详解
2013/04/30 PHP
如何在php中正确的使用json
2013/08/06 PHP
php绘制一个扇形的方法
2015/01/24 PHP
TP5框架实现的数据库备份功能示例
2020/04/05 PHP
JQuery 表单中textarea字数限制实现代码
2009/12/07 Javascript
jquery左右滚动焦点图banner图片鼠标经过显示上下页按钮
2013/10/11 Javascript
JS设置获取cookies的方法
2014/01/26 Javascript
原生js和jQuery随意改变div属性style的名称和值
2014/10/22 Javascript
JavaScript中原型和原型链详解
2015/02/11 Javascript
JavaScript中通过prototype属性共享属性和方法的技巧实例
2015/03/13 Javascript
jQuery图片旋转插件jQueryRotate.js用法实例(附demo下载)
2016/01/21 Javascript
jQuery实现的多滑动门,多选项卡效果代码
2016/03/28 Javascript
jQueryUI DatePicker 添加时分秒
2016/06/04 Javascript
聊一聊JS中this的指向问题
2016/06/17 Javascript
关于vue-router路径计算问题
2017/05/10 Javascript
详解node如何让一个端口同时支持https与http
2017/07/04 Javascript
C#实现将一个字符转换为整数
2017/12/12 Javascript
详解Element 指令clickoutside源码分析
2019/02/15 Javascript
深入了解响应式React Native Echarts组件
2019/05/29 Javascript
JsonProperty 的使用方法详解
2019/10/11 Javascript
jquery实现烟花效果(面向对象)
2020/03/10 jQuery
Jquery Fade用法详解
2020/11/06 jQuery
python 创建弹出式菜单的实现代码
2017/07/11 Python
Python实现基于SVM的分类器的方法
2019/07/19 Python
python操作cfg配置文件方式
2019/12/22 Python
django-xadmin根据当前登录用户动态设置表单字段默认值方式
2020/03/13 Python
Django admin 实现search_fields精确查询实例
2020/03/30 Python
Python如何读写字节数据
2020/08/05 Python
Super-Pharm波兰:药房和香水在一个地方
2020/08/18 全球购物
科技开发中心办公室主任岗位责任制
2014/02/10 职场文书
怎么写好自荐书
2014/03/02 职场文书
师范生求职信
2014/06/14 职场文书
三八妇女节主持词
2015/07/04 职场文书
IDEA 链接Mysql数据库并执行查询操作的完整代码
2021/05/20 MySQL
vue @click.native 绑定原生点击事件
2022/04/22 Vue.js
js面向对象编程OOP及函数式编程FP区别
2022/07/07 Javascript