首頁 > web前端 > js教程 > 如何使用 JavaScript 或 jQuery 下載檔案而不重新載入頁面?

如何使用 JavaScript 或 jQuery 下載檔案而不重新載入頁面?

Barbara Streisand
發布: 2024-12-15 06:47:15
原創
462 人瀏覽過

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 動態設定target屬性:

$('a#someID').attr({target: '_blank', href: 'file.pdf'});
登入後複製

當使用者點擊超連結時,target 屬性確保檔案下載在新分頁或視窗中。

以上是如何使用 JavaScript 或 jQuery 下載檔案而不重新載入頁面?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板