JS打開圖片另存為對(duì)話框?qū)崿F(xiàn)代碼
更新時(shí)間：2012年12月26日 11:57:56 作者：
使用JS打開圖片另存為對(duì)話框一直都是網(wǎng)頁(yè)應(yīng)用中不可缺少的一部分，本人有些好奇，于是搜集整理了一些實(shí)現(xiàn)代碼，不知道符不符合大眾的口味，在此班門弄斧了，需要的朋友可以了解下
單擊按鈕打開圖片另存為對(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{
//圖片地址沒有變化，直接另存為
_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{
//圖片地址沒有變化，直接另存為
_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-04
video.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-08
JS多個(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-08
關(guān)于JavaScript中事件的一些重要說(shuō)明,需要的朋友可以參考下。2009-10-10
zTree插件之單選下拉菜單實(shí)例代碼。需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2013-11-11
uniapp中微信小程序與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-08
Bootstrap每天必學(xué)之面板，面板（Panels）是Bootstrap框架新增的一個(gè)組件，其主要作用就是用來(lái)處理一些其他組件無(wú)法完成的功能，對(duì)面板感興趣的小伙伴們可以參考一下2015-11-11
JavaScript開發(fā)時(shí)的五個(gè)注意事項(xiàng)
JavaScript開發(fā)時(shí)的五個(gè)注意事項(xiàng)講述了表單事件、鏈接、循環(huán)優(yōu)化、匿名函數(shù)、字符串連接等優(yōu)化技巧,需要的朋友可以參考一下2007-12-12
這篇文章主要介紹了對(duì)javaScript原型鏈的理解,以實(shí)例形式對(duì)javaScript原型鏈的概念及相關(guān)使用技巧做了較為淺顯易懂的分析,需要的朋友可以參考下2015-05-05
BootStrap Validator 版本差異問題導(dǎo)致的submitHandler失效問題的解決方法
這篇文章主要介紹了BootStrap Validator 版本差異問題導(dǎo)致的submitHandler失效問題的解決方法,下面通過(guò)本文給大家詳細(xì)說(shuō)明一下，需要的朋友可以參考下2016-12-12