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 firefox不显示本地预览图片问题的解决方法
Nov 12 Javascript
JavaScript面向对象之体会[总结]
Nov 13 Javascript
Javascript 检测键盘按键信息及键码值对应介绍
Jan 03 Javascript
CKEditor无法验证的解决方案(js验证+jQuery Validate验证)
May 09 Javascript
Angularjs中UI Router的使用方法
May 14 Javascript
JS修改地址栏参数实例代码
Jun 14 Javascript
jquery插件格式实例分析
Jun 16 Javascript
JQuery 动态生成Table表格实例代码
Dec 02 Javascript
jQuery Collapse1.1.0折叠插件简单使用
Aug 28 jQuery
JQuery搜索框自动补全(模糊匹配)功能实现示例
Jan 08 jQuery
如何正确理解vue中的key详解
Nov 02 Javascript
Element Breadcrumb 面包屑的使用方法
Jul 26 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框架的性能
2008/01/10 PHP
php中mysql模块部分功能的简单封装
2011/09/30 PHP
PDO的安全处理与事物处理方法
2016/10/31 PHP
thinkPHP内置字符串截取函数用法详解
2016/11/15 PHP
yii2的restful api路由实例详解
2019/05/14 PHP
Laravel实现通过blade模板引擎渲染视图
2019/10/25 PHP
laravel返回统一格式错误码问题
2019/11/04 PHP
一段好玩的JavaScript代码
2006/12/01 Javascript
表单提交时自动复制内容到剪贴板的js代码
2007/03/16 Javascript
自己动手开发jQuery插件教程
2011/08/25 Javascript
根据身份证号自动输出相关信息(籍贯,出身日期,性别)
2013/11/15 Javascript
JavaScript判断变量是否为undefined的两种写法区别
2013/12/04 Javascript
javascript eval(func())使用示例
2013/12/05 Javascript
javascript内置对象操作详解
2015/02/04 Javascript
Vue.js划分组件的方法
2017/10/29 Javascript
ES6解构赋值实例详解
2017/10/31 Javascript
vue-cli 构建骨架屏的方法示例
2018/11/08 Javascript
vue-cli3 项目从搭建优化到docker部署的方法
2019/01/28 Javascript
详解用场景去理解函数柯里化(入门篇)
2019/04/11 Javascript
详解从0开始搭建微信小程序(前后端)的全过程
2019/04/15 Javascript
原生JS实现动态添加新元素、删除元素方法
2019/05/05 Javascript
解决新版Pycharm中Matplotlib图像不在弹出独立的显示窗口问题
2019/01/15 Python
Pytorch之Variable的用法
2019/12/31 Python
Python各种扩展名区别点整理
2020/02/27 Python
Python变量格式化输出实现原理解析
2020/08/06 Python
python 窃取摄像头照片的实现示例
2021/01/08 Python
python使用numpy中的size()函数实例用法详解
2021/01/29 Python
Nike英国官网:Nike.com (UK)
2017/02/13 全球购物
4s客服专员岗位职责
2013/12/01 职场文书
编辑找工作求职信分享
2014/01/03 职场文书
普通党员个人对照检查材料
2014/09/18 职场文书
2014年护士个人工作总结
2014/11/11 职场文书
2014年统战工作总结
2014/12/09 职场文书
导游词之云南省玉龙雪山
2019/12/19 职场文书
Netflix《海贼王》真人版剧集多张片场照曝光
2022/04/04 日漫
分析SQL窗口函数之排名窗口函数
2022/04/21 Oracle