Shulou(Shulou.com)05/31 Report--

Today, the editor will share with you the relevant knowledge points about the method of clicking on the download file on the HTML page. The content is detailed and the logic is clear. I believe most people still know too much about this knowledge, so share this article for your reference. I hope you can get something after reading this article. Let's learn about it.

1. Use tags to do this

Click 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 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") / / know a backend interface 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: download $eleForm.submit () via 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). }). These are all the contents of the article "Click to download Files on the HTML Page". 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.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.