>웹 프론트엔드 >JS 튜토리얼 >페이지를 다시 로드하지 않고 JavaScript 또는 jQuery를 사용하여 파일을 다운로드하려면 어떻게 해야 합니까?

페이지를 다시 로드하지 않고 JavaScript 또는 jQuery를 사용하여 파일을 다운로드하려면 어떻게 해야 합니까?

Barbara Streisand
Barbara Streisand원래의
2024-12-15 06:47:15470검색

How Can I Download a File Using JavaScript or jQuery Without Reloading the Page?

페이지 콘텐츠를 바꾸지 않고 JavaScript/jQuery를 사용하여 파일 다운로드

사용자가 하이퍼링크를 클릭하면 일반적으로 현재 웹 페이지 내에서 해당 콘텐츠가 열립니다. 그러나 페이지 콘텐츠를 바꾸지 않고 파일 다운로드를 수동으로 실행해야 하는 시나리오도 있습니다.

이를 달성하려면 두 가지 주요 접근 방식을 활용할 수 있습니다.

1. 보이지 않는 iFrame 사용:

HTML에 보이지 않는 iframe 요소를 만듭니다.

<iframe>

그런 다음 JavaScript를 사용하여 iframe의 "src" 속성을 파일 URL로 설정합니다.

function Download(url) {
  document.getElementById('my_iframe').src = url;
}

브라우저가 특정 파일(예: HTML, 텍스트)을 웹페이지로 해석하지 못하게 하고 강제로 다운로드하려면 서버 측에서 MIME 유형을 "application/x-please-download-me" 또는 "application/octet-stream"으로 설정해야 할 수도 있습니다.

2. 새 탭에서 파일 열기:

새 탭에서 다운로드를 열려면 하이퍼링크의 대상 속성을 수정할 수 있습니다.

<a href="file.pdf" target="_blank">Download</a>

또는 jQuery를 사용하여 동적으로 설정합니다. 대상 속성:

$('a#someID').attr({target: '_blank', href: 'file.pdf'});

사용자가 하이퍼링크를 클릭하면 대상 속성은 파일이 다음 경로로 다운로드되도록 보장합니다. 새 탭이나 창.

위 내용은 페이지를 다시 로드하지 않고 JavaScript 또는 jQuery를 사용하여 파일을 다운로드하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.