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 全等号运算符使用说明
May 31 Javascript
JQuery之focus函数使用介绍
Aug 20 Javascript
如何通过javascript操作web控件的自定义属性
Nov 25 Javascript
JS实现简易图片轮播效果的方法
Mar 25 Javascript
ztree获取选中节点时不能进入可视区域出现BUG如何解决
Dec 03 Javascript
jquery  实现轮播图详解及实例代码
Oct 12 Javascript
简单理解Vue条件渲染
Dec 03 Javascript
JavaScript箭头函数_动力节点Java学院整理
Jun 28 Javascript
vue2.0的contextmenu右键弹出菜单的实例代码
Jul 24 Javascript
vue2.0项目实现路由跳转的方法详解
Jun 21 Javascript
微信小程序实现的一键连接wifi功能示例
Apr 24 Javascript
vue-dplayer 视频播放器实例代码
Nov 08 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笔记之:php函数range() round()和list()的使用说明
2013/04/26 PHP
php计算两个整数的最大公约数常用算法小结
2015/03/05 PHP
PHP实现批量修改文件名的方法示例
2019/09/18 PHP
Javascript技巧之不要用for in语句对数组进行遍历
2010/10/20 Javascript
基于jquery的修改当前TAB显示标题的代码
2010/12/11 Javascript
JavaScript格式化日期时间的方法和自定义格式化函数示例
2014/04/04 Javascript
JS下载文件|无刷新下载文件示例代码
2014/04/17 Javascript
浅谈window.onbeforeunload() 事件调用ajax
2016/06/29 Javascript
AngularJS 所有版本下载地址
2016/09/14 Javascript
Canvas实现动态的雪花效果
2017/02/13 Javascript
JavaScript实现256色转灰度图
2017/02/22 Javascript
关于Vue背景图打包之后访问路径错误问题的解决
2017/11/03 Javascript
js 原生判断内容区域是否滚动到底部的实例代码
2017/11/15 Javascript
微信小程序在ios下Echarts图表不能滑动的问题解决
2019/07/10 Javascript
Vue快速实现通用表单验证的示例代码
2020/01/09 Javascript
微信小程序scroll-view点击项自动居中效果的实现
2020/03/25 Javascript
js 数据类型判断的方法
2020/12/03 Javascript
Python socket C/S结构的聊天室应用实现
2014/11/30 Python
Python中对列表排序实例
2015/01/04 Python
详细讲解Python中的文件I/O操作
2015/05/24 Python
Python中使用多进程来实现并行处理的方法小结
2017/08/09 Python
Python logging模块用法示例
2018/08/28 Python
Python2和Python3.6环境解决共存问题
2018/11/09 Python
基于Python实现粒子滤波效果
2020/12/01 Python
html5 div布局与table布局详解
2016/11/16 HTML / CSS
Gerry Weber德国官网:优质女性时装,德国最大的时装公司之一
2019/11/02 全球购物
广告设计应届生求职信
2014/03/01 职场文书
银行柜员求职自荐书
2014/06/18 职场文书
毕业设计论文评语
2014/12/31 职场文书
表扬通报怎么写
2015/01/16 职场文书
西湖英语导游词
2015/02/06 职场文书
导游词格式
2015/02/13 职场文书
大卫科波菲尔读书笔记
2015/06/30 职场文书
导游带团欢迎词
2015/09/30 职场文书
MySQL系列之十五 MySQL常用配置和性能压力测试
2021/07/02 MySQL
SQL Server中的逻辑函数介绍
2022/05/25 SQL Server