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 MD4
Dec 20 Javascript
jquery中的mouseleave和mouseout的区别 模仿下拉框效果
Feb 07 Javascript
node.js中的querystring.parse方法使用说明
Dec 10 Javascript
解析javascript瀑布流原理实现图片滚动加载
Mar 10 Javascript
Angular 路由route实例代码
Jul 12 Javascript
基于JS实现仿京东搜索栏随滑动透明度渐变效果
Jul 10 Javascript
Vue仿手机qq的实例代码(demo)
Sep 08 Javascript
vuejs实现递归树型菜单组件
Jan 13 Javascript
微信小程序switch开关选择器使用详解
Jan 31 Javascript
bootstrap tooltips在 angularJS中的使用方法
Apr 10 Javascript
小谈angular ng deploy的实现
Apr 07 Javascript
javascript实现简易计算器功能
Sep 23 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基于自定义函数生成笛卡尔积的方法示例
2017/09/30 PHP
PHP实现链式操作的三种方法详解
2017/11/16 PHP
PHP面向对象程序设计之多态性的应用示例
2018/12/19 PHP
php时间戳转换代码详解
2019/08/04 PHP
日历查询的算法 如何计算某一天是星期几
2012/12/12 Javascript
IE的fireEvent方法概述及应用
2013/02/22 Javascript
Jquery 复选框取值兼容FF和IE8(测试有效)
2013/10/29 Javascript
jquery实现可拖动DIV自定义保存到数据的实例
2013/11/20 Javascript
js实现class样式的修改、添加及删除的方法
2015/01/20 Javascript
JavaScript框架是什么?怎样才能叫做框架?
2015/07/01 Javascript
jQuery+Ajax请求本地数据加载商品列表页并跳转详情页的实现方法
2017/07/12 jQuery
浅谈react-native热更新react-native-pushy集成遇到的问题
2017/09/30 Javascript
JS点击动态添加标签、删除指定标签的代码
2018/04/18 Javascript
jQuery.parseJSON()函数详解
2019/02/28 jQuery
小程序卡片切换效果组件wxCardSwiper的实现
2020/02/13 Javascript
Vue 中使用lodash对事件进行防抖和节流操作
2020/07/26 Javascript
Python Mysql数据库操作 Perl操作Mysql数据库
2009/01/12 Python
Django的URLconf中使用缺省视图参数的方法
2015/07/18 Python
Python读写txt文本文件的操作方法全解析
2016/06/26 Python
Python中selenium实现文件上传所有方法整理总结
2017/04/01 Python
一看就懂得Python的math模块
2018/10/21 Python
梅尔频率倒谱系数(mfcc)及Python实现
2019/06/18 Python
Python3 A*寻路算法实现方式
2019/12/24 Python
使用PyTorch实现MNIST手写体识别代码
2020/01/18 Python
Python控制台实现交互式环境执行
2020/06/09 Python
Origins悦木之源英国官网:雅诗兰黛集团高端植物护肤品牌
2017/11/06 全球购物
俄罗斯金苹果网上化妆品和香水商店:Goldapple
2019/12/01 全球购物
高级技校毕业生自荐信
2013/11/18 职场文书
趣味游戏活动方案
2014/02/07 职场文书
学校学习雷锋活动总结
2014/07/03 职场文书
学校交通安全责任书
2014/08/25 职场文书
淘宝好评语句大全
2014/12/31 职场文书
幼儿园个人师德总结
2015/02/06 职场文书
2015年班主任德育工作总结
2015/05/21 职场文书
网吧管理制度范本
2015/08/05 职场文书
孩子满月酒答谢词
2015/09/30 职场文书