我生成正常的链接,如:<a href="/path/to/image"><img src="/path/to/image" /></a>在web应用程序。
当我点击链接时,它会在一个新页面中显示图片。如果你想保存图片,你需要右键点击它,选择“另存为”
我不希望这种行为,我想有一个下载框弹出时,我点击链接,这是可能的只是与html或javascript?如何?
如果没有,我想我将不得不写一个下载。php脚本,并调用它到href与文件名作为参数…?
我生成正常的链接,如:<a href="/path/to/image"><img src="/path/to/image" /></a>在web应用程序。
当我点击链接时,它会在一个新页面中显示图片。如果你想保存图片,你需要右键点击它,选择“另存为”
我不希望这种行为,我想有一个下载框弹出时,我点击链接,这是可能的只是与html或javascript?如何?
如果没有,我想我将不得不写一个下载。php脚本,并调用它到href与文件名作为参数…?
当前回答
纯html/javascript是做不到的。这是因为你有一个单独的连接到web服务器来检索一个单独的文件(图像),一个正常的web服务器将提供设置了内容头的文件,以便读取内容类型的浏览器将决定该类型可以在内部处理。
The way to force the browser not to handle the file internally is to change the headers (content-disposition prefereably, or content-type) so the browser will not try to handle the file internally. You can either do this by writing a script on the webserver that dynamically sets the headers (i.e. download.php) or by configuring the webserver to return different headers for the file you want to download. You can do this on a per-directory basis on the webserver, which would allow you to get away without writing any php or javascript - simply have all your download images in that one location.
其他回答
为图像或html创建下载链接的最简单的方法是设置下载属性,但此解决方案只适用于现代浏览器。
<a href="/path/to/image" download="myimage"><img src="/path/to/image" /></a>
“myimage”是要下载的文件名称。扩展将自动添加 例子
简单的代码图像下载与图像点击使用php
<html>
<head>
<title> Download-Button </title>
</head>
<body>
<p> Click the image ! You can download! </p>
<?php
$image = basename("http://localhost/sc/img/logo.png"); // you can here put the image path dynamically
//echo $image;
?>
<a download="<?php echo $image; ?>" href="http://localhost/sc/img/logo.png" title="Logo title">
<img alt="logo" src="http://localhost/sc/img/logo.png">
</a>
</body>
<a href="download.php?file=path/<?=$row['file_name']?>">Download</a>
download.php:
<?php
$file = $_GET['file'];
download_file($file);
function download_file( $fullPath ){
// Must be fresh start
if( headers_sent() )
die('Headers Sent');
// Required for some browsers
if(ini_get('zlib.output_compression'))
ini_set('zlib.output_compression', 'Off');
// File Exists?
if( file_exists($fullPath) ){
// Parse Info / Get Extension
$fsize = filesize($fullPath);
$path_parts = pathinfo($fullPath);
$ext = strtolower($path_parts["extension"]);
// Determine Content Type
switch ($ext) {
case "pdf": $ctype="application/pdf"; break;
case "exe": $ctype="application/octet-stream"; break;
case "zip": $ctype="application/zip"; break;
case "doc": $ctype="application/msword"; break;
case "xls": $ctype="application/vnd.ms-excel"; break;
case "ppt": $ctype="application/vnd.ms-powerpoint"; break;
case "gif": $ctype="image/gif"; break;
case "png": $ctype="image/png"; break;
case "jpeg":
case "jpg": $ctype="image/jpg"; break;
default: $ctype="application/force-download";
}
header("Pragma: public"); // required
header("Expires: 0");
header("Cache-Control: must-revalidate, post-check=0, pre-check=0");
header("Cache-Control: private",false); // required for certain browsers
header("Content-Type: $ctype");
header("Content-Disposition: attachment; filename=\"".basename($fullPath)."\";" );
header("Content-Transfer-Encoding: binary");
header("Content-Length: ".$fsize);
ob_clean();
flush();
readfile( $fullPath );
} else
die('File Not Found');
}
?>
纯html/javascript是做不到的。这是因为你有一个单独的连接到web服务器来检索一个单独的文件(图像),一个正常的web服务器将提供设置了内容头的文件,以便读取内容类型的浏览器将决定该类型可以在内部处理。
The way to force the browser not to handle the file internally is to change the headers (content-disposition prefereably, or content-type) so the browser will not try to handle the file internally. You can either do this by writing a script on the webserver that dynamically sets the headers (i.e. download.php) or by configuring the webserver to return different headers for the file you want to download. You can do this on a per-directory basis on the webserver, which would allow you to get away without writing any php or javascript - simply have all your download images in that one location.
图片下载使用图片点击!
我做了这个简单的代码!:)
<html>
<head>
<title> Download-Button </title>
</head>
<body>
<p> Click the image ! You can download! </p>
<a download="logo.png" href="http://localhost/folder/img/logo.png" title="Logo title">
<img alt="logo" src="http://localhost/folder/img/logo.png">
</a>
</body>
</html>