JS打开图片另存为对话框 （转）

最新推荐文章于 2024-05-11 21:19:51 发布
最新推荐文章于 2024-05-11 21:19:51 发布
阅读量334 收藏
点赞数
文章标签： javascript ViewUI
原文链接：http://www.cnblogs.com/zhwl/archive/2012/02/13/2349596.html
版权
单击按钮打开图片另存为对话框的示例如下:

<! 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){
             // 图片地址发生变化，加载图片
            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 >


posted on 2010-04-15 11:58 weiwei 阅读(1459) 评论(6)   编辑   收藏


评论

#  re: JS打开图片另存为对话框 2010-10-09 13:57 qq401774330
我直接把代码保存为html，但是用不了。qq401774330   回复   更多评论
  

#  re: JS打开图片另存为对话框 2010-10-09 14:09 qq401774330
很急，麻烦指点下。qq401774330谢谢！！   回复   更多评论
  

#  re: JS打开图片另存为对话框 2010-10-10 10:55 weiwei
@qq401774330
保存代码后，要把
<input type="button" value="download image" οnclick="downLoadImage(' http://www.blogjava.net/images/logo.gif');">

中的图片地址' http://www.blogjava.net/images/logo.gif'改成你本地的地址，不然，就是跨域访问。浏览器安全性阻止这个操作。   回复   更多评论
  

#  re: JS打开图片另存为对话框 2010-10-10 11:08 weiwei
@qq401774330
把jquery去掉用JS直接操作dom会比较好：
<!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 language="JavaScript">
<!--
function downLoadImage(imagePathURL){
//如果中间IFRAME不存在，则添加
if(!document.getElementById("_SAVEASIMAGE_TEMP_FRAME")){
var iframe = document.createElement('iframe');
iframe.setAttribute('style','display:none;');
iframe.setAttribute('id','_SAVEASIMAGE_TEMP_FRAME');
iframe.setAttribute('name','_SAVEASIMAGE_TEMP_FRAME');
iframe.setAttribute('src','about:blank');
document.appendChild(iframe);
}
if(document.all._SAVEASIMAGE_TEMP_FRAME.src!=imagePathURL){
//图片地址发生变化，加载图片
document.all._SAVEASIMAGE_TEMP_FRAME.src = imagePathURL;
_doSaveAsImage();
}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" οnclick="downLoadImage('tomcat.gif');">
</body>
</html>   回复   更多评论
  

#  re: JS打开图片另存为对话框 2011-09-01 15:53 123654
为什么保存本地也不可以啊 本地图片也不行   回复   更多评论
  

#  re: JS打开图片另存为对话框 2011-09-01 15:54 123654
为什么本地的图片也不行啊？...   回复   更多评论
  

转载于:https://www.cnblogs.com/zhwl/archive/2012/02/13/2349596.html

weixin_30371469
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
js弹出保存对话框
08-26
js弹出保存对话框
JS打开图片另存为对话框实现代码
01-19
单击按钮打开图片另存为对话框的示例如下 代码如下:<!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://aj
javascript实现另存为对话框
lzq0107的博客
08-12 2412
&lt;html&gt; &lt;head&gt; &lt;title&gt; New Document &lt;/title&gt; &lt;meta name="Generator" content="EditPlus"&gt; &lt;meta name="Author" content=""&gt;
JavaScript实现控制打开文件另存为对话框的方法
10-24
主要介绍了JavaScript实现控制打开文件另存为对话框的方法,实例分析了javascript实现文件另存为的技巧,非常具有实用价值,需要的朋友可以参考下
打开,另存为,属性,打印等14个JS代码
06-02
ShowSave 显示“另存为”对话框 ShowColor 显示“颜色”对话框 ShowFont 显示“字体”对话框 ShowPrinter 显示“打印”或“打印选项”对话框 ShowHelp 调用 Windows 帮助引擎 在对话框接口上单击，Common...
JavaScript网页特效范例宝典源码
09-04
实例032 打开窗口时显示对话框 50 实例033 使窗口背景透明 50 实例034 立体窗口 52 实例035 动态标题栏 53 实例036 固定大小的窗口 54 1.6 框架的应用 55 实例037 框架集的嵌套 56 实例038 在网页中应用浮动框架 58 ...
js 控制图片另存为
weixin_30653023的博客
01-13 431
<html><body><script type="text/javascript"> function Saveit(){ temp.document.execCommand("saveas")} </script> <iframe id="temp" style="display:none"></iframe> &l...
JS图片另存为
sty2008boy的专栏
09-15 574
&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt; New Document &lt;/title&gt; &lt;meta name="Generator" content="EditPl
ie js实现打开另存为对话框，
OnePiece
07-24 4717
var userAgent = navigator.userAgent, isIE = /msie/i.test(userAgent) && !window.opera, isWebKit = /webkit/i.test(userAgent), isFirefox = /firefox/i.test(userAgent); var url = jQuery("#xuwanting")[0].s
jquery 下载图片另存为
airrence的博客
07-22 2079
1，场景：附件列表上传操作字段，有一个下载按钮，现在附件，当附件类型为图片时，A标签无法另存为。 2，解决办法，采用表单提交的方式，由后端java处理完，采用iamgeIo输出到页面。 前端代码[code="java"] [/code] js[code="java"]function downloadImg(imagePathURL){ $("...
js小方法+Canvas 利用js 实现浏览器保存图片到本地
热门推荐
SWSHBON的博客
06-07 3万+
很多时候会看到 ：<input type="button" id="btnsavaImg" value="保存图片到本地" onclick="Download()"/> 这都是固定好的，但是如果你有一天需要动态的去添加方法 或者是根据条件的去绑定点击事件下面的方法呢？需要调用js 的 元素.addEventListener(event, function,useCapture) even
Servlet 中直接弹出"文件另存为..."对话框
白首太玄经
10-23 2995
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { //下载zip文件             ServletOutputStream out = response.getOutputStream();
在html页面上实现弹出对话框,选择文件保存路径,js获取a标签download弹出另存为对话框的路径。...
weixin_39622710的博客
06-07 2938
在html或者jsp中弹出文件另存为的对话框，可以调用document.execCommand方法调用JS方法document.execCommand即可在前台页面调出另存为对话框，并将将服务器上存放的文件保存到本地。HTML页面另存为对话框DEMO.rar代码：functiongetimg()//另存为存放在服务器上图片到本地的方法{event.returnValue=false;show....
前端实现弹出“另存为”对话框的三种方式
wunianisme的博客
08-24 1万+
今天开发一个需求，需要将一段字符串保存到文件中，并且保存之后在页面上弹出“另存为”对话框来实现将文件保存到指定位置。那么应该如何来实现在前端弹出“另存为”对话框呢？ 调用document.execCommand方法 调用js方法document.execCommand可在前台页面调出“另存为”对话框，并将将服务器上存放的文件保存到本地指定的位置。需要注意的是，部分IE浏览器中，可能会阻止显示内容，...
TypeScript中的函数类型注解：精确定义行为与意图
逐星的博客
05-11 373
在TypeScript中，函数不仅是一段执行特定任务的代码块，它们还可以拥有自己的类型。函数类型注解允许开发者定义函数的参数类型和返回值类型，从而提高代码的可读性和可维护性。函数类型注解是TypeScript中定义函数时的重要特性，它有助于确保函数参数和返回值符合预期，从而提高代码的准确性和安全性。
使用 js 类封装项目中音频播放功能的工具方法utils
qq_40868156的博客
05-07 218
封装音频播放功能的工具方法，js，es6，前端，工程化
ts函数？
最新发布
FENGZXCjjjjj的博客
05-11 217
只要参数类型是匹配的，那么就认为它是有效的函数类型，而不在乎参数名是否正确。第二部分是返回值类型。对于返回值，我们在函数和返回值类型之前使用( =>)符号，使之清晰明了。如之前提到的，返回值类型是函数类型的必要部分，如果函数没有返回任何值，你也必须指定返回值类型为 void而不能留空。函数的类型只是由参数类型和返回值组成的。函数中使用的捕获变量不会体现在类型里。实际上，这些变量是函数的隐藏状态并不是组成API的一部分。
文本框实现打开保存另存为
05-25
文本框的打开、保存和另存为功能可以通过 HTML5 中的 File API 来实现。 首先，我们需要在 HTML 中创建一个文本框和操作按钮： ```html <textarea id="myTextarea"></textarea> ()">打开 ()">保存 ()">另存为 ``` ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值