首頁 > web前端 > js教程 > 主體

jQuery不使用外掛及swf實作無刷新檔案上傳_jquery

WBOY
發布: 2016-05-16 16:28:14
原創
1383 人瀏覽過

檔案上傳是網站常用的功能,例如附件或圖片的上傳功能,解決方案也有很多,我們今天介紹一種透過jQuery無刷新的檔案上傳方式。

首先,我們在頁面中放一個form,用來上傳檔案:

複製程式碼 程式碼如下:

    enctype="multipart/form-data" target="asyncTarget">
    文件:
   


然後,在頁面中放一個iframe,在上傳的時候只刷新iframe,而不是整個網頁:

複製程式碼 程式碼如下:


接下來使用js為按鈕新增功能:

複製程式碼 程式碼如下:

<script><br />     $(function () {<br />         $("#btnUpload").click(function () {<br />             $("#myForm").submit();<br />         });<br />     });<br /> </script>

在按鈕點擊的時候,將form提交。

這個方案可以簡單的實作無刷新的檔案上傳。它的實作思路是:將form提交到一個iframe中,其它的處理就像處理普通的form提交一樣了。

這個方案的待完善地方是如何判斷上傳完成,目前只有一個想法:透過js監聽iframe的readystate,然後解析iframe的內容。

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