How to download files by clicking on HTML page
Today, I would like to share with you how to click on the HTML page to download the relevant knowledge of the file, detailed content, clear logic, I believe that most people still know too much about this knowledge, so share this article for your reference, I hope you can learn something after reading this article, let's take a look at it.
1. Use tags to do this
Click to download
In this way, when the user opens the browser and clicks the link, the file will be downloaded directly.
However, there is a situation, such as txt,png,jpg and other browsers that support direct opening of the file will not perform the download task, but will directly open the file. At this time, you need to add an attribute "download" to the a tag.
The following is an example
Move to the label to display the file path, and complete the file path according to the path prompt
Click to download
The following methods may be used to download pictures uploaded from a web page
Get the host domain name:
Location.hostname
Get the port number:
Location.port
two。 Use buttons to monitor
Button monitoring can be divided into two methods.
One is window.open ()
Var$eleBtn1=$ ("# btn1")
Var$eleBtn2=$ ("# btn2")
/ / known a backend API for downloading files: https://codeload.github.com/douban/douban-client/legacy.zip/master
/ / method 1: window.open ()
$eleBtn1.click (function () {
Window.open ("https://codeload.github.com/douban/douban-client/legacy.zip/master");"
})
The second is form submission.
/ / method 2: through form
$eleBtn2.click (function () {
Var$eleForm=$ ("")
EleForm.attr ("action", "https://codeload.github.com/douban/douban-client/legacy.zip/master");"
(document.body) .append ($eleForm)
/ / submit the form to download
$eleForm.submit ()
})
These are all the contents of the article "how to click on the HTML page to download the file". Thank you for reading! I believe you will gain a lot after reading this article. The editor will update different knowledge for you every day. If you want to learn more knowledge, please pay attention to the industry information channel.