我<a href="https://stackoverflow.com/path/to/image"><img src="/path/to/image" /></a>在网络应用程序中生成普通链接，例如：
当我单击链接时，它将在新页面中显示图片。如果要保存图片，则需要右键单击它并选择“另存为”
我不希望这种行为，我想在单击链接时弹出一个下载框，这可能仅适用于html或javascript吗？怎么样？
如果不是，我想我将不得不编写一个download.php脚本，并使用文件名作为参数将其调用到href中...？
Answers:
<a download="custom-filename.jpg" href="/path/to/image" title="ImageName">
<img alt="ImageName" src="/path/to/image">
</a>
尚不完全支持caniuse，但是您可以将其与modernizr结合使用（在Non- coredetects下）以检查浏览器的支持。
为图像或html创建下载链接的最简单方法是设置download属性，但是此解决方案仅在现代浏览器中有效。
<a href="/path/to/image" download="myimage"><img src="/path/to/image" /></a>
“ myimage”是要下载的文件的名称。扩展将自动添加 此例
<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');
}
?>
<a href="download.php?file=../dbparams.inc>">Download</a>。此处的更多信息：en.wikipedia.org/wiki/Directory_traversal_attack
如果您使用的是HTML5，则可以在链接中添加属性“下载”。
<a href="/test.pdf" download>
HTML下载属性，用于指定当用户单击超链接时将下载目标。
仅当设置了href属性时，才使用此属性。
该属性的值将是下载文件的名称。允许的值没有限制，浏览器将自动检测正确的文件扩展名并将其添加到文件（.img，.pdf，.txt，.html等）中。
示例代码：
<a href="https://www.w3schools.com/images/myw3schoolsimage.jpg"> Download Image >></a>
HTML5：
<a href="https://www.w3schools.com/images/myw3schoolsimage.jpg" download> Download Image >></a>
输出：
HTML5下载或Chrome
您无法使用纯html / javascript做到这一点。这是因为您具有与Web服务器的单独连接以检索单独的文件（图像），并且普通的Web服务器将为设置了内容标头的文件提供文件，以便浏览器读取内容类型将决定可以在内部处理该类型。
强制浏览器不在内部处理文件的方法是更改标头（最好是内容放置或内容类型），以便浏览器不会尝试在内部处理文件。您可以通过在网络服务器上编写一个脚本来动态设置标头（例如，download.php）来完成此操作，也可以通过配置网络服务器为要下载的文件返回不同的标头来做到这一点。您可以在网络服务器上的每个目录上执行此操作，这将使您无需编写任何php或javascript即可摆脱困境-只需将所有下载图像放在该位置即可。
<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>
我做了这个简单的代码！：）
<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>