页面中如何添加图片下载按钮，点击则下载当前页中的图片？？

[vicepaladin]

通过以下方式加到页面中，感觉不好用啊！！高手求教啊！！

<a href="javascript:void(0)" onclick="downloadPic()" id="tpdown" target="_self" ><span ><img src="http://group.zcool.com.cn/images/digest1.gif" border="0" width="27px" height="16" title="正文图片下载" /></span></a>


function downloadPic()
{

$("#tpdown").attr("href",'http://image.zcool.com.cn/avatar/17/71/m_1265382211497.jpg');


}

[blogaspnet]

asp.net的话，可以让后台读取这个图片，然后分段下载。试试行不行。

有问题请到我的博客留言，我会及时回复的。

[愚者只看星不看答案]

这个需要服务端参与。。。
在服务端中修改响应的mime类型，浏览器为直接提示下载。
然后js中，去window.open(url)就可以下载了

[愚者只看星不看答案]

一个示例，会下载根目录下的log.txt文件

<form action="default.aspx" method="get">
<input type="button" value="submit" onclick="this.form.submit()" />
</form>

 protected void Page_Load(object sender, EventArgs e)
        {
            Response.Clear();
            Response.ContentType = "application/x-zip-compressed";
            Response.AddHeader("Content-Disposition", "attachment;filename=log.txt");
            Response.TransmitFile(Server.MapPath("~/log.txt"));
        }

[hongmei85]

图片都会被浏览器直接显示，不会出现下载对话框

<a href="http://image.zcool.com.cn/avatar/17/71/m_1265382211497.jpg" id="tpdown" target="_blank" ><span ><img src="http://group.zcool.com.cn/images/digest1.gif" border="0" width="27px" height="16" title="正文图片下载" /></span></a>

让 用户打开图片，然后右键保存

[vicepaladin]

[Quote=引用 1 楼 hongmei85 的回复:]
图片都会被浏览器直接显示，不会出现下载对话框

<a href="http://image.zcool.com.cn/avatar/17/71/m_1265382211497.jpg" id="tpdown" target="_blank" ><span ><img src="http://group.zcool.com.cn/images/digest1.gif" border="0" wi……
[/Quote]

那新浪这个页面中的下载链接是怎么做到的呢？？


http://slide.sports.sina.com.cn/g/slide_2_730_14919.html

[MuBeiBei]

直接a标签，然后写在href里就行了~·

<a href="http://image.zcool.com.cn/avatar/17/71/m_1265382211497.jpg" id="tpdown" target="_blank" ></a>

[vicepaladin]

感觉应该是可以做到的吧~~网站页面上加上下载按钮很方便啊~~体验

[vicepaladin]

[Quote=引用 3 楼 mubeibei 的回复:]
直接a标签，然后写在href里就行了~·

<a href="http://image.zcool.com.cn/avatar/17/71/m_1265382211497.jpg" id="tpdown" target="_blank" ></a>
[/Quote]

试验了下，也是弹出个窗口查看的效果啊~~

下面新浪这个就实现了这个功能啊~
http://slide.sports.sina.com.cn/g/slide_2_730_14919.html

[MuBeiBei]

[Quote=引用 4 楼 vicepaladin 的回复:]
感觉应该是可以做到的吧~~网站页面上加上下载按钮很方便啊~~体验
[/Quote]

新浪的那个下载按钮js事件~·你可以改一下~·

//下载图片
function downloadPic(){
	try{
		var src = epidiascope.filmstrips[epidiascope.selectedIndex].src;
		src = src.replace(/http\:\/\/(i0|i1|i2|i3|www)\.sinaimg\.cn\//i,"");
		document.getElementById("downloadPicFrame").src ="http://slide.news.sina.com.cn/iframe/download.php?img=" + src;
	}catch(e){};
};

[MuBeiBei]

<iframe id="downloadPicFrame" width="1" height="0" frameborder="0" scrolling="no"></iframe>

页面上写一个隐藏的iframe