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 相关文章推荐
jQuery 标题的自动翻转实现代码
Oct 14 Javascript
基于jQuery试卷自动排版系统
Jul 18 Javascript
javascript中使用正则计算中文长度的例子
Apr 29 Javascript
Position属性之relative用法
Dec 14 Javascript
angularJS 如何读写缓冲的方法(推荐)
Aug 06 Javascript
socket.io学习教程之基本应用(二)
Apr 29 Javascript
vue2.0 与 bootstrap datetimepicker的结合使用实例
May 22 Javascript
基于LayUI分页和LayUI laypage分页的使用示例
Aug 02 Javascript
vue  自定义组件实现通讯录功能
Sep 30 Javascript
angular使用md5,CryptoJS des加密的方法
Jun 03 Javascript
解决layer.msg 不居中 ifram中的问题
Sep 05 Javascript
JS原型prototype和__proto__用法实例分析
Mar 14 Javascript
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
php下利用curl判断远程文件是否存在的实现代码
2011/10/08 PHP
YII Framework框架教程之安全方案详解
2016/03/14 PHP
Laravel如何使用Redis共享Session
2018/02/23 PHP
PHP+Ajax简单get验证操作示例
2019/03/02 PHP
javascript onkeydown,onkeyup,onkeypress,onclick,ondblclick
2009/02/04 Javascript
javascript内置对象arguments详解
2014/03/16 Javascript
js实现新年倒计时效果
2015/12/10 Javascript
JavaScript代码生成PDF文件的方法
2016/02/26 Javascript
JS实现自动阅读单词(有道单词本添加功能)
2016/11/14 Javascript
微信小程序开发的四十个技术窍门总结(推荐)
2017/01/23 Javascript
jquery实现数字输入框
2017/02/22 Javascript
Angularjs 动态添加指令并绑定事件的方法
2017/04/13 Javascript
NodeJs安装npm包一直失败的解决方法
2017/04/28 NodeJs
JS非空验证及邮箱验证的实例
2017/08/11 Javascript
深入浅析JavaScript中的RegExp对象
2017/09/18 Javascript
React-Native左右联动List的示例代码
2017/09/21 Javascript
[02:55]含熏伴清风,风行者至宝、屠夫身心及典藏宝瓶二展示
2020/09/08 DOTA
Python subprocess模块学习总结
2014/03/13 Python
python简单实现计算过期时间的方法
2015/06/09 Python
PyCharm在新窗口打开项目的方法
2019/01/17 Python
python Scrapy爬虫框架的使用
2021/01/21 Python
鱼油专家:Omegavia
2016/10/10 全球购物
翻译学院毕业生自荐书
2014/02/02 职场文书
中餐厅主管的职责范文
2014/02/04 职场文书
校园摄影活动策划方案
2014/02/05 职场文书
秋季运动会活动方案
2014/02/05 职场文书
创先争优活动方案
2014/02/12 职场文书
2014年党员加强作风建设思想汇报
2014/09/15 职场文书
大学生入党积极分子党校学习思想汇报
2014/10/25 职场文书
销售员态度差检讨书
2014/10/26 职场文书
2014年预算员工作总结
2014/12/05 职场文书
教务处教学工作总结
2015/08/10 职场文书
SQL SERVER中常用日期函数的具体使用
2021/04/08 SQL Server
将图片保存到mysql数据库并展示在前端页面的实现代码
2021/05/02 MySQL
vue 自定义组件添加原生事件
2022/04/21 Vue.js
win sever 2022如何占用操作主机角色
2022/06/25 Servers