HTML download the file by link

Question

Download file by link does not work. When clicked, it goes to the next tab of the browser and opens the file. Chrome 65 version

<a download href="images/download.png">download</a>

Answer 1

Try changing the path, if the path is not accurate it will open a new tab

 <a href="/images/download.png" download> Download </a> 

Further reference https://www.w3schools.com/tags/att_a_download.asp

Answer 2

Use application/octet-stream

<a href="/images/download.png" download type="application/octet-stream "> Download </a>

It's simply do it!!!
for more format: https://www.stubbornjava.com/posts/what-is-a-content-type

Answer 3

$('a').click(function(e) {
    e.preventDefault();  //stop the browser from following
    window.location.href = 'uploads/file.doc';
});

<a href="withoutscript.html">Download now!</a>

try this one with jquery or without jquery code both are working

Answer 4

Try this one also, will help you

 $('.download-file').on('click', function(e) { // For IE if(window.navigator.msSaveOrOpenBlob) { var blobObject = new Blob(['<p>Hello world!</p>'], {type : 'text/html'}); window.navigator.msSaveOrOpenBlob(blobObject, 'somefile.html'); e.preventDefault(); } // For browsers that support the `download` attribute else { // You could also create the url with `window.URL.createObjectURL` // var blobObject = new Blob(['<p>Hello world!</p>'], {type : 'text/html'}); // this.href = window.URL.createObjectURL(blobObject) this.href = 'data:text/html;charset=utf-8,' + encodeURIComponent('<p>Hello world!</p>'); } /* * / // Doesn't work, idk. It was an attempt for an IE solution // Suggested here: http://stackoverflow.com/a/25179390/796832 // and here: http://stackoverflow.com/a/25179390/796832 var bufferIframe = document.createElement('iframe'); bufferIframe.setAttribute('sandbox', 'allow-same-origin'); bufferIframe.setAttribute('srcdoc', '<p>Hello world!</p>'); document.body.appendChild(bufferIframe); bufferIframe.contentWindow.document.open('text/plain', 'replace'); // Keep jsFiddle from complaining about the `write` using bufferIframe.contentWindow.document['write']('<p>write Hello world!</p>'); bufferIframe.contentWindow.document.close(); //console.dir(bufferIframe.contentDocument); bufferIframe.contentWindow.document.execCommand('SaveAs', true, 'request.bin'); /* */ }); 

 <p>Download a file demo</p> <a href="http://i.stack.imgur.com/kaxff.png" download="savename.png">Download `download` attribute</a> <br> <a href="#0" class="download-file" download="some-file.html">Download via JS</a> <br> <hr> Note: <ul> <li>You could always just add the `Content-Disposition: attachment; filename="somefile.html"`</li> <li>You can even add the header in .htaccess: `Header set Content-Disposition "attachment"`</li> </ul> 

For reference https://jsfiddle.net/MadLittleMods/dywbo5vx/

Answer 5

Download link is not working if link path is not proper so that please check image path is proper or not? Then after check download link is working or not?