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 相关文章推荐
UserData用法总结 lanyu出品
Jul 01 Javascript
js原型链原理看图说明
Jul 07 Javascript
node.js中的fs.readdirSync方法使用说明
Dec 17 Javascript
JavaScript小技巧整理篇(非常全)
Jan 26 Javascript
Node.JS中事件轮询(Event Loop)的解析
Feb 25 Javascript
JS实现点击Radio动态更新table数据
Jul 18 Javascript
ionic2屏幕适配实现适配手机、平板等设备的示例代码
Aug 11 Javascript
一份超级详细的Vue-cli3.0使用教程【推荐】
Nov 15 Javascript
一文了解vue-router之hash模式和history模式
May 31 Javascript
js贪心算法 钱币找零问题代码实例
Sep 11 Javascript
Vue中this.$nextTick的作用及用法
Feb 04 Javascript
在vue中使用cookie记住用户上次选择的实例(本次例子中为下拉框)
Sep 11 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
使用TinyButStrong模板引擎来做WEB开发
2007/03/16 PHP
采集邮箱的php代码(抓取网页中的邮箱地址)
2012/07/17 PHP
php.ini修改php上传文件大小限制的方法详解
2013/06/17 PHP
怎样使用php与jquery设置和读取cookies
2013/08/08 PHP
PHP页面中文乱码分析
2013/10/29 PHP
调试Node.JS的辅助工具(NodeWatcher)
2012/01/04 Javascript
如何使用jquery控制CSS样式,并且取消Css样式(如背景色,有实例)
2013/07/09 Javascript
js向上无缝滚动,网站公告效果 具体代码
2013/11/18 Javascript
使用GruntJS构建Web程序之合并压缩篇
2014/06/06 Javascript
jQuery简易时光轴实现方法示例
2017/03/13 Javascript
Webpack实现按需打包Lodash的几种方法详解
2017/05/08 Javascript
swiper自定义分页器使用方法详解
2020/09/14 Javascript
浅析Angular19 自定义表单控件
2018/01/31 Javascript
浅谈手写node可读流之流动模式
2018/06/01 Javascript
vue中引用swiper轮播插件的教程详解
2018/08/16 Javascript
vue中使用GraphQL的实例代码
2019/11/04 Javascript
javascript利用键盘控制小方块的移动
2020/04/20 Javascript
零基础写python爬虫之爬虫框架Scrapy安装配置
2014/11/06 Python
深入理解 Python 中的多线程 新手必看
2016/11/20 Python
django2 快速安装指南分享
2018/01/05 Python
python通过elixir包操作mysql数据库实例代码
2018/01/31 Python
Pytorch 实现权重初始化
2019/12/31 Python
pytorch::Dataloader中的迭代器和生成器应用详解
2020/01/03 Python
python绘制封闭多边形教程
2020/02/18 Python
如何将PySpark导入Python的放实现(2种)
2020/04/26 Python
python类共享变量操作
2020/09/03 Python
详解tensorflow之过拟合问题实战
2020/11/01 Python
python爬虫今日热榜数据到txt文件的源码
2021/02/23 Python
GWT (Google Web Toolkit)有哪些主要的原件组成?
2015/06/08 面试题
幼儿园教师辞职信
2014/01/18 职场文书
老总助理工作岗位职责
2014/02/06 职场文书
保送生自荐信范文
2015/03/26 职场文书
Python超简单容易上手的画图工具库推荐
2021/05/10 Python
Jupyter Notebook 如何修改字体和大小以及更改字体样式
2021/06/03 Python
浅谈哪个Python库才最适合做数据可视化
2021/06/28 Python
MySQL里面的子查询的基本使用
2021/08/02 MySQL