JS打開(kāi)圖片另存為對(duì)話框?qū)崿F(xiàn)代碼
更新時(shí)間:2012年12月26日 11:57:56 作者:
使用JS打開(kāi)圖片另存為對(duì)話框一直都是網(wǎng)頁(yè)應(yīng)用中不可缺少的一部分,本人有些好奇,于是搜集整理了一些實(shí)現(xiàn)代碼,不知道符不符合大眾的口味,在此班門弄斧了,需要的朋友可以了解下
單擊按鈕打開(kāi)圖片另存為對(duì)話框的示例如下
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script language="JavaScript">
<!--
function downLoadImage(imagePathURL){
//如果中間IFRAME不存在,則添加
if(!document.getElementById("_SAVEASIMAGE_TEMP_FRAME"))
jQuery('<iframe style="display:none;" id="_SAVEASIMAGE_TEMP_FRAME" name="_SAVEASIMAGE_TEMP_FRAME" onload="_doSaveAsImage();"
width="0" height="0" src="about:blank"></iframe>').appendTo("body");
if(document.all._SAVEASIMAGE_TEMP_FRAME.src!=imagePathURL){
//圖片地址發(fā)生變化,加載圖片
document.all._SAVEASIMAGE_TEMP_FRAME.src = imagePathURL;
}else{
//圖片地址沒(méi)有變化,直接另存為
_doSaveAsImage();
}
}
function _doSaveAsImage(){
if(document.all._SAVEASIMAGE_TEMP_FRAME.src!="about:blank")
document.frames("_SAVEASIMAGE_TEMP_FRAME").document.execCommand("SaveAs");
}
//-->
</script>
</head>
<body>
<input type="button" value="download image" onclick="downLoadImage('http://www.blogjava.net/images/blogjava_net/weiwei/46570/r_beyond1991.jpg');">
</body>
</html>
復(fù)制代碼 代碼如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script language="JavaScript">
<!--
function downLoadImage(imagePathURL){
//如果中間IFRAME不存在,則添加
if(!document.getElementById("_SAVEASIMAGE_TEMP_FRAME"))
jQuery('<iframe style="display:none;" id="_SAVEASIMAGE_TEMP_FRAME" name="_SAVEASIMAGE_TEMP_FRAME" onload="_doSaveAsImage();"
width="0" height="0" src="about:blank"></iframe>').appendTo("body");
if(document.all._SAVEASIMAGE_TEMP_FRAME.src!=imagePathURL){
//圖片地址發(fā)生變化,加載圖片
document.all._SAVEASIMAGE_TEMP_FRAME.src = imagePathURL;
}else{
//圖片地址沒(méi)有變化,直接另存為
_doSaveAsImage();
}
}
function _doSaveAsImage(){
if(document.all._SAVEASIMAGE_TEMP_FRAME.src!="about:blank")
document.frames("_SAVEASIMAGE_TEMP_FRAME").document.execCommand("SaveAs");
}
//-->
</script>
</head>
<body>
<input type="button" value="download image" onclick="downLoadImage('http://www.blogjava.net/images/blogjava_net/weiwei/46570/r_beyond1991.jpg');">
</body>
</html>
您可能感興趣的文章:
- JS+ACTIVEX實(shí)現(xiàn)網(wǎng)頁(yè)選擇本地目錄路徑對(duì)話框
- JS給超鏈接加確認(rèn)對(duì)話框的方法
- js確認(rèn)刪除對(duì)話框適用于a標(biāo)簽及submit
- js彈出確認(rèn)是否刪除對(duì)話框
- JS對(duì)話框_JS模態(tài)對(duì)話框showModalDialog用法總結(jié)
- JS 模態(tài)對(duì)話框和非模態(tài)對(duì)話框操作技巧匯總
- 九種js彈出對(duì)話框的方法總結(jié)
- js彈出模式對(duì)話框,并接收回傳值的方法
- JS彈出對(duì)話框返回值代碼(asp.net后臺(tái))
- js中常用的彈出對(duì)話框3種方式
- JS實(shí)現(xiàn)網(wǎng)頁(yè)每隔3秒彈出一次對(duì)話框的方法
相關(guān)文章
查看QQ是否在線狀態(tài)的網(wǎng)頁(yè)代碼
這個(gè)其實(shí)就是利用qq官方提供的東西,簡(jiǎn)單的通過(guò)圖片來(lái)測(cè)試是否在線,隱身也是不在線狀態(tài)。純粹學(xué)習(xí)使用。2010-04-04video.js 實(shí)現(xiàn)視頻只能后退不能快進(jìn)的思路詳解
這篇文章主要介紹了video.js 實(shí)現(xiàn)視頻只能后退不能快進(jìn)的思路詳解,主要思路是點(diǎn)擊進(jìn)度條需要獲取拖動(dòng)前的時(shí)間點(diǎn),具體實(shí)例代碼大家跟隨小編一起看看吧2018-08-08JS多個(gè)表單數(shù)據(jù)提交下的serialize()應(yīng)用實(shí)例分析
這篇文章主要介紹了JS多個(gè)表單數(shù)據(jù)提交下的serialize()應(yīng)用,接合實(shí)例形式分析了原生javascript實(shí)現(xiàn)多個(gè)表單提交時(shí)serialize操作相關(guān)使用技巧與操作注意事項(xiàng),需要的朋友可以參考下2019-08-08uniapp中微信小程序與H5相互跳轉(zhuǎn)以及傳參詳解(webview)
在單位做項(xiàng)目的時(shí)候碰到一個(gè)需求,需要從微信小程序跳轉(zhuǎn)到H5頁(yè)面,下面這篇文章主要給大家介紹了關(guān)于uniapp中微信小程序與H5相互跳轉(zhuǎn)以及傳參的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-08-08JavaScript開(kāi)發(fā)時(shí)的五個(gè)注意事項(xiàng)
JavaScript開(kāi)發(fā)時(shí)的五個(gè)注意事項(xiàng)講述了表單事件、鏈接、循環(huán)優(yōu)化、匿名函數(shù)、字符串連接等優(yōu)化技巧,需要的朋友可以參考一下2007-12-12BootStrap Validator 版本差異問(wèn)題導(dǎo)致的submitHandler失效問(wèn)題的解決方法
這篇文章主要介紹了BootStrap Validator 版本差異問(wèn)題導(dǎo)致的submitHandler失效問(wèn)題的解決方法,下面通過(guò)本文給大家詳細(xì)說(shuō)明一下,需要的朋友可以參考下2016-12-12