首页 文章

单击href图像链接下载

提问于
浏览 次
151

我在网络应用中生成普通链接，如： <a href="/path/to/image"><img src="/path/to/image" /></a> .

当我点击链接时，它会在新页面中显示图片 . 如果要保存图片，则需要右键单击它并选择“另存为”

我不想要这种行为，我想在点击链接时弹出一个下载框，这可能只是用html或javascript吗？怎么样？

如果不是，我想我必须写一个download.php脚本并将其调用到href，文件名为参数...？

html image download href

10 回答

  • 5

    如果您使用的是HTML5，则可以将属性“download”添加到链接中 .

    <a href="/test.pdf" download>

    http://www.w3schools.com/tags/att_a_download.asp

    回复于
  • 45

    你不能用纯html / javascript做到这一点 . 这是因为您与Web服务器有单独的连接以检索单独的文件（图像），而普通的Web服务器将为文件提供内容标头设置，以便浏览内容类型的浏览器将决定是否可以在内部处理该类型 .

    强制浏览器不在内部处理文件的方法是更改 Headers （内容处置优先或内容类型），以便浏览器不会尝试在内部处理文件 . 您可以通过在动态设置 Headers （即download.php）的Web服务器上编写脚本，或者通过配置Web服务器为您要下载的文件返回不同的 Headers 来执行此操作 . 您可以在网络服务器上以每个目录为基础执行此操作，这将允许您在不编写任何php或javascript的情况下离开 - 只需将所有下载图像放在该位置即可 .

    回复于
  • -4
    <a download="custom-filename.jpg" href="/path/to/image" title="ImageName">
    <img alt="ImageName" src="/path/to/image">
</a>

    它尚未完全支持 http://caniuse.com/#feat=download ，但您可以使用modernizr https://modernizr.com/download/?adownload-setclasses （在非核心检测下）来检查浏览器的支持 .

    回复于
  • 10

    为图像或html创建下载链接的最简单方法是设置download attribute，但此解决方案仅适用于现代浏览器 .

    <a href="/path/to/image" download="myimage"><img src="/path/to/image" /></a>

    "myimage"是要下载的文件的名称 . 扩展名将自动添加Example here

    回复于
  • 51
    <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');

}
?>
    回复于
  • 3

    不，不是 . 您将需要服务器上的某些内容来发送Content-Disposition标头以将文件设置为附件而不是内联 . 你可以用普通的Apache配置来做到这一点 .

    我找到了an example of doing it using mod_rewrite，虽然我知道有一种更简单的方法 .

    回复于
  • 6

    试试这个...

    <a href="/path/to/image" download>
    <img src="/path/to/image" />
 </a>
    回复于
  • 3

    使用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>
    回复于
  • 1

    使用图像点击下载图像！

    我做了这个简单的代码！:)

    <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>
    回复于
  • 202

    有两种简单的方法可以避免打开任何文件而不是下载 . 1.）一个简单的解决方案，即防弹，是将图像的扩展名更改为浏览器不理解的内容，例如myimage.zzz . 但是，您需要告诉访问者在下载后更改扩展名 . 也许不那么实用 . 2.）将图像放入拉链中，我通常使用我不想立即打开的文件 .

    下载标记不适用于safari或IExplorer . 我希望有帮助吗？

    回复于

相关问题