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中void(0)的具体含义解释
Feb 27 Javascript
extJs 文本框后面加上说明文字+下拉列表选中值后触发事件
Nov 27 Javascript
与jquery serializeArray()一起使用的函数,主要来方便提交表单
Jan 31 Javascript
jquery 无限级联菜单案例分享
Mar 26 Javascript
js二级地域选择的实现方法
Jun 17 Javascript
jQuery查询数据返回object和字符串影响原因是什么
Aug 09 Javascript
下一代Bootstrap的5个特点 超酷炫!
Jun 17 Javascript
微信小程序前端源码逻辑和工作流
Sep 25 Javascript
不间断循环滚动效果的实例代码(必看篇)
Oct 08 Javascript
基于JS分页控件实现简单美观仿淘宝分页按钮效果
Nov 07 Javascript
BootStrap与Select2使用小结
Feb 17 Javascript
ES6新特性之数组、Math和扩展操作符用法示例
Apr 01 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
PHP4实际应用经验篇(8)
2006/10/09 PHP
PHP得到mssql的存储过程的输出参数功能实现
2012/11/23 PHP
ThinkPHP实现将本地文件打包成zip下载
2014/06/26 PHP
php设计模式之观察者模式实例详解【星际争霸游戏案例】
2020/03/30 PHP
jQuery用unbind方法去掉hover事件及其他方法介绍
2013/03/18 Javascript
JSON序列化与解析原生JS方法且IE6和chrome测试通过
2013/09/05 Javascript
jquery.cookie() 方法的使用(读取、写入、删除)
2013/12/05 Javascript
jquery实现通用版鼠标经过淡入淡出效果
2014/06/15 Javascript
jquery动态遍历Json对象的属性和值的方法
2016/07/27 Javascript
浅谈angularjs依赖服务注入写法的注意点
2017/04/24 Javascript
详解Angular4中路由Router类的跳转navigate
2017/06/09 Javascript
BootStrap Fileinput上传插件使用实例代码
2017/07/28 Javascript
vue实现登陆登出的实现示例
2017/09/15 Javascript
详解关于Vue2.0路由开启keep-alive时需要注意的地方
2018/09/18 Javascript
小程序实现搜索界面 小程序实现推荐搜索列表效果
2019/05/18 Javascript
vue双击事件2.0事件监听(点击-双击-鼠标事件)和事件修饰符操作
2020/07/27 Javascript
详解Vite的新体验
2021/02/22 Javascript
[39:11]DOTA2上海特级锦标赛C组资格赛#2 LGD VS Newbee第二局
2016/02/28 DOTA
Python获取昨天、今天、明天开始、结束时间戳的方法
2018/06/01 Python
数据清洗--DataFrame中的空值处理方法
2018/07/03 Python
Python socket模块方法实现详解
2019/11/05 Python
python opencv 实现对图像边缘扩充
2020/01/19 Python
python读取图片的几种方式及图像宽和高的存储顺序
2020/02/11 Python
3种方式实现瀑布流布局小结
2019/09/05 HTML / CSS
AmazeUI 手机版页面的顶部导航条Header与侧边导航栏offCanvas的示例代码
2020/08/19 HTML / CSS
花卉与景观设计系大学生求职信
2013/10/01 职场文书
实习生单位鉴定意见
2013/12/04 职场文书
好矿嫂事迹材料
2014/01/21 职场文书
运动会入场解说词300字
2014/01/25 职场文书
应聘文员自荐信范文
2014/03/11 职场文书
签约仪式主持词
2014/03/19 职场文书
年度安全生产目标责任书
2014/07/23 职场文书
博士给导师的自荐信
2015/03/06 职场文书
三八妇女节新闻稿
2015/07/17 职场文书
《折线统计图》教学反思
2016/02/22 职场文书
Python中使用subprocess库创建附加进程
2021/05/11 Python