简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
집 > 웹 프론트엔드 > HTML 튜토리얼 > 본문

html은 클릭하여 파일을 직접 다운로드하는 것을 실현합니다.

王林
풀어 주다： 2020-03-03 17:58:43
앞으로
11329명이 탐색했습니다.

html은 클릭하여 파일을 직접 다운로드하는 것을 실현합니다.

1. 사용자가 브라우저를 열고 링크를 클릭하면 파일이 직접 다운로드되도록 태그 

<a href="/user/test/xxxx.txt" download="文件名.txt">点击下载</a>
로그인 후 복사

를 사용하세요.

하지만 브라우저가 직접 열기를 지원하는 txt, png, jpg 등의 파일은 다운로드 작업을 수행하지 않고 파일을 직접 여는 경우가 있습니다. 이 경우 "다운로드" 속성을 추가해야 합니다. "를 a 태그에 ;

(추천 학습 튜토리얼: html 입문 튜토리얼)

예제는 다음과 같습니다.

레이블 레이블로 이동하여 파일 경로를 표시하고 그에 따라 파일 경로를 완성합니다. 경로 프롬프트로

<!DOCTYPE html>  
<html>  
    <head>  
        <meta charset="UTF-8">  
        <title></title>  
    </head>  
    <body>  
        <a href="321.png" download="test.png">点击下载</a>    
    </body>  
</html>
로그인 후 복사

웹 페이지에 업로드된 사진을 다운로드하려면 다음 방법을 사용할 수 있습니다.

호스트 도메인 이름 가져오기:

location.hostname

포트 번호 가져오기:

location .port

2. 버튼을 사용하여 모니터링

버튼 모니터링은 두 가지 방법으로 나눌 수 있습니다.

하나는 window.open()

var $eleBtn1 = $("#btn1");  
        var $eleBtn2 = $("#btn2");  
        //已知一个下载文件的后端接口：https://codeload.github.com/douban/douban-client/legacy.zip/master  
        //方法一：window.open()  
        $eleBtn1.click(function(){  
            window.open("https://codeload.github.com/douban/douban-client/legacy.zip/master");  
        });
로그인 후 복사

다른 하나는 양식 제출

//方法二：通过form  
        $eleBtn2.click(function(){  
            var $eleForm = $("<form method=&#39;get&#39;></form>");  
            $eleForm.attr("action","https://codeload.github.com/douban/douban-client/legacy.zip/master");  
            $(document.body).append($eleForm);  
            //提交表单，实现下载  
            $eleForm.submit();  
        });
로그인 후 복사

더 많은 프로그래밍 관련 내용을 보려면, PHP 중국어 홈페이지프로그래밍 입문 칼럼을 주목해주세요!

위 내용은 html은 클릭하여 파일을 직접 다운로드하는 것을 실현합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨：
html
원천：jb51.net
이전 기사：정적 웹 페이지란 무엇이며 웹 페이지에는 어떤 웹 페이지가 있습니까? 다음 기사：HTML 배경 이미지를 전체 화면으로 만드는 방법
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
최신 이슈
PX가 REM 오류로 자동 변환  <style>html {   글꼴 크기: calc(100vw / 3.75);      }body {    글꼴 크기: 0.16rem;      }&l...
에서 2024-04-16 09:34:16
0
0
4687
페이지가 갑자기 CSS나 부트스트랩을 가져올 수 없습니다. 그래서 저는 페이지를 개발 중입니다. 어제 일부 작업을 했는데 잘 작동했고, 오늘은 나머지 작업을 계속했는데 모든 것이 괜찮습니다. 일반 HTML 페이지로 열려고...
에서 2024-04-06 21:58:04
0
1
800
CSS에서 페이지 하단의 신비한 공백을 해결하는 방법 Bootstrap과 D3를 사용하여 간단한 웹페이지를 구축하려고 하는데 하단의 공백을 모두 없애는 방법을 모르겠습니다. 나는 그것을 제거하고 싶다. 본문과 HTM...
에서 2024-04-06 20:22:15
0
1
454
Livewire 게으른 자리 표시자와 함께 laravel 구성 요소를 사용하는 방법 livewire3 자리 표시자 안에 내 laravel 구성 요소의 뼈대를 추가하고 싶습니다. 지금까지 시도한 작업: Laravel 구성 요소를 포함하는 Livew...
에서 2024-04-06 20:02:10
0
2
543
문자열을 HTML 코드(배열에서 생성됨)로 바꾸는 최상위 방법 다음과 같은 문자열이 주어지면...$htmlPattern="Usernameis:#name#andusercompanyis#company#";하위 ...
에서 2024-04-06 17:40:41
0
2
410
관련 주제
더>
인기 추천
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트：공공복지 온라인 PHP 교육，PHP 학습자의 빠른 성장을 도와주세요！