<a href="https://stackoverflow.com/path/to/image"><img src="/path/to/image" /></a>Bir web uygulamasında normal bağlantılar oluşturuyorum .

Bağlantıyı tıkladığımda, resmi yeni bir sayfada görüntüler. Resmi kaydetmek istiyorsanız, resmi sağ tıklamanız ve "farklı kaydet" i seçmeniz gerekir

Bu davranışı istemiyorum, bağlantıyı tıklattığımda bir indirme kutusunun çıkmasını istiyorum, sadece html veya javascript ile mümkün mü? Nasıl?

Değilse ben bir download.php komut dosyası yazmak ve parametre olarak dosya adı ile href çağırmak zorunda sanırım ...?

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

Henüz tam olarak desteklenmemektedir http://caniuse.com/#feat=download , ancak modernizr ile kullanabilirsiniz https://modernizr.com/download/?adownload-setclasses ( çekirdek olmayan detektörler altında ) desteğini kontrol etmek için tarayıcı.

Resim veya html için indirme bağlantısı oluşturmanın en kolay yolu indirme özelliğini ayarlamaktır , ancak bu çözüm yalnızca modern tarayıcılarda çalışır.

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

"myimage" indirilecek dosyanın adıdır. Uzantı otomatik olarak eklenecek Burada örnek

<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');

}
?>

Hayır, değil. Dosyayı satır içi yerine ek olarak ayarlamak üzere bir Content-Disposition üstbilgisi göndermek için sunucuda bir şeye ihtiyacınız olacaktır. Bunu düz Apache yapılandırmasıyla da yapabilirsiniz.

Ben daha basit bir yolu olduğunu biliyorum rağmen, mod_rewrite kullanarak bunu bir örnek buldum .

HTML5 kullanıyorsanız, bağlantılarınıza 'indir' özelliğini ekleyebilirsiniz.

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

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

Bunu dene...

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

Bir kullanıcı köprüyü tıkladığında hedefin indirileceğini belirtmek için HTML indirme özelliği.

Bu özellik yalnızca href özelliği ayarlanmışsa kullanılır.

Özniteliğin değeri, indirilen dosyanın adı olacaktır. İzin verilen değerlerde herhangi bir kısıtlama yoktur ve tarayıcı otomatik olarak doğru dosya uzantısını algılar ve dosyaya ekler (.img, .pdf, .txt, .html, vb.).

Örnek kod:

<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>

Çıktı :

Resmi İndir >>

Html5 indir veya krom

Resmi İndir >>

Saf html / javascript ile yapamazsınız. Bunun nedeni, ayrı bir dosya (görüntü) almak için web sunucusuna ayrı bir bağlantınızın olması ve normal bir web sunucusunun, içerik türlerini okuyan tarayıcının türün dahili olarak işlenmesine karar vermesi için içeriği içerik başlıkları ayarlanmış olarak sunmasıdır.

Tarayıcıyı dosyayı dahili olarak işlememeye zorlamanın yolu, üstbilgileri (tercihen içerik düzenleme veya içerik türü) değiştirmektir, böylece tarayıcı dosyayı dahili olarak işlemeye çalışmaz. Bunu web sunucusunda üstbilgileri dinamik olarak ayarlayan bir komut dosyası yazarak (ör. Download.php) veya web sunucusunu indirmek istediğiniz dosya için farklı üstbilgiler döndürecek şekilde yapılandırarak yapabilirsiniz. Bunu herhangi bir php veya javascript yazmadan kurtulmanıza izin verecek web sunucusu üzerinde dizin başına temelinde yapabilirsiniz - sadece tüm indirme resimlerinizi tek bir konumda bulundurun.

Php kullanarak bir görüntü tıklayarak görüntü indirmek için Basit Kod

<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>

Görüntü tıklama ile görüntü indirme!

Bu basit kodu yaptım! :)

<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>