快捷導(dǎo)航

js實(shí)現(xiàn)點(diǎn)擊圖片將圖片地址復(fù)制到粘貼板的方法

更新時(shí)間：2015年02月16日 10:44:21 作者：代碼家園

這篇文章主要介紹了js實(shí)現(xiàn)點(diǎn)擊圖片將圖片地址復(fù)制到粘貼板的方法,涉及js操作節(jié)點(diǎn)的技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下

本文實(shí)例講述了js實(shí)現(xiàn)點(diǎn)擊圖片將圖片地址復(fù)制到粘貼板的方法。分享給大家供大家參考。具體如下：

<!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>點(diǎn)擊圖片直接把圖片地址復(fù)制到粘貼板</title>

<style type="text/css">

 #www_jb51_net_hidden {

  position:absolute;

  visibility:hidden;

 }

 img {

  cursor:pointer ;

 }

</style>

</head>

<body>

點(diǎn)擊下面的圖片直接獲取得地址。

 <div id="jb51_net">

  <img src="images/m10.jpg"><br />

 </div>

 <span id="www_jb51_net_hidden"></span>

</body>

<script type="text/javascript">

<!--

 $id=function(id) {

  return document.getElementById(id);

 }

 var objs =$id("jb51_net").getElementsByTagName("img") ;

 for (var i=0;i<objs.length;i++ ) {

  objs[i].onclick=function () {

   $id("www_jb51_net_hidden").innerHTML=this.src ;

   var my_range =document.body.createTextRange() ;

   my_range.moveToElementText($id("www_jb51_net_hidden"));

   my_range.execCommand("copy");

   alert("圖片地址已經(jīng)復(fù)制到剪貼板");

   return false ;

  }

 }

//-->

</script>

</html>

希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

JS實(shí)現(xiàn)用戶(hù)注冊(cè)界面功能
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)用戶(hù)注冊(cè)界面功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-09-09
深入理解javascript作用域第二篇之詞法作用域和動(dòng)態(tài)作用域
這篇文章主要介紹了javascript作用域第二篇之詞法作用域和動(dòng)態(tài)作用域的相關(guān)資料，非常不錯(cuò)，具有參考借鑒價(jià)值，感興趣的朋友可以參考下
2016-07-07
代碼生成器 document.write()
代碼生成器 document.write()...
2007-04-04
Array.prototype.concat不是通用方法反駁[譯]
ECMAScript 5.1規(guī)范中指出,數(shù)組方法concat是通用的(generic).本文反駁了這一結(jié)論,因?yàn)閷?shí)際上并不是這樣的
2012-09-09
js 性能優(yōu)化之快速響應(yīng)的用戶(hù)界面
本文主要介紹了js性能優(yōu)化的快速響應(yīng)的用戶(hù)界面。具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧
2017-02-02
JavaScript Math對(duì)象和調(diào)試程序的方法分析
這篇文章主要介紹了JavaScript Math對(duì)象和調(diào)試程序的方法,結(jié)合實(shí)例形式分析了javascript中Math對(duì)象生成隨機(jī)數(shù)以及使用alert()、console.log()函數(shù)進(jìn)行錯(cuò)誤調(diào)試相關(guān)操作技巧,需要的朋友可以參考下
2019-05-05
關(guān)于微信小程序map組件z-index的層級(jí)問(wèn)題分析
這篇文章主要給大家介紹了關(guān)于微信小程序map組件z-index的層級(jí)問(wèn)題的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用微信小程序具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-07-07
Javascript中內(nèi)建函數(shù)reduce的應(yīng)用詳解
內(nèi)建函數(shù)其實(shí)就是內(nèi)置函數(shù),reduce函數(shù)是ECMAScript5規(guī)范中出現(xiàn)的數(shù)組方法。在平時(shí)的工作中，相信大家使用的場(chǎng)景并不多，這篇文章給大家詳細(xì)介紹了函數(shù)reduce的應(yīng)用以及多重疊加，有需要的朋友們可以參考借鑒，下面來(lái)一起看看吧。
2016-10-10
JavaScript實(shí)現(xiàn)私有屬性的幾種方式小結(jié)
在JavaScript中,私有屬性是指只能在對(duì)象內(nèi)部訪(fǎng)問(wèn)的屬性,外部無(wú)法直接訪(fǎng)問(wèn),JavaScript并沒(méi)有提供官方的私有屬性的支持,但可以通過(guò)一些技巧來(lái)模擬實(shí)現(xiàn)私有屬性,所以本文給大家總結(jié)了JavaScript實(shí)現(xiàn)私有屬性的幾種方式,需要的朋友可以參考下
2024-04-04
改變狀態(tài)欄文字的js代碼
這篇文章主要介紹了通過(guò)js如何改變狀態(tài)欄文字,需要的朋友可以了解下
2014-06-06