jQuery不使用插件及swf實(shí)現(xiàn)無刷新文件上傳
更新時(shí)間：2014年12月08日 17:34:10 投稿：hebedich
這篇文章主要介紹了jQuery不使用插件及swf實(shí)現(xiàn)無刷新文件上傳,需要的朋友可以參考下
文件上傳是網(wǎng)站常用的功能，例如附件或圖片的上傳功能，解決方案也有很多，我們今天介紹一種通過jQuery無刷新的文件上傳方式。
首先，我們在頁面中放一個form，用來上傳文件：
復(fù)制代碼 代碼如下:
<form id="myForm" method="post" action="/asyncFileUpload/UploadHandler.ashx"
enctype="multipart/form-data" target="asyncTarget">
<span>文件：</span>
<input type="file" name="myFile" />
</form>
<input type="button" value="上傳" id="btnUpload" />
然后，在頁面中放一個iframe，在上傳的時(shí)候只刷新iframe，而不是整個網(wǎng)頁：
復(fù)制代碼 代碼如下:
<iframe name="asyncTarget" style="display: none;"></iframe>
接下來使用js為按鈕添加功能：
復(fù)制代碼 代碼如下:
<script>
$(function () {
$("#btnUpload").click(function () {
$("#myForm").submit();
});
});
</script>
在按鈕單擊的時(shí)候，將form提交。
這個方案可以簡單的實(shí)現(xiàn)無刷新的文件上傳。它的實(shí)現(xiàn)思路是：將form提交到一個iframe中，其它的處理就像處理普通的form提交一樣了。
這個方案的待完善地方是如何判斷上傳完成，目前只有一個思路：通過js監(jiān)聽iframe的readystate，然后解析iframe的內(nèi)容。
相關(guān)文章
利用jquery.getScript()跨域調(diào)用文件，具體說這個文件可以是什么類型還有待于進(jìn)一步跟進(jìn)。2010-11-11
EasyUI的doCellTip實(shí)現(xiàn)鼠標(biāo)放到單元格上提示單元格內(nèi)容
本篇文章主要介紹了easyUI的doCellTip 就是鼠標(biāo)放到單元格上有個提示的功能，對于Javascript教程感興趣的同學(xué)可以參考一下2016-08-08
BootStrap輕松實(shí)現(xiàn)微信頁面開發(fā)代碼分享
本文給大家分享一段代碼關(guān)于bootstrap實(shí)現(xiàn)微信開發(fā)頁面的代碼，非常不錯代碼簡單易懂，感興趣的朋友一起看看吧2016-10-10
本章節(jié)主要介紹了jQuery在HTML中動態(tài)插入節(jié)點(diǎn)的各種方法,制作成表格，方便大家對比學(xué)習(xí)，需要的朋友可以參考下2015-03-03
jquery插件制作 表單驗(yàn)證實(shí)現(xiàn)代碼
今天的內(nèi)容是關(guān)于表單驗(yàn)證插件的制作。表單驗(yàn)證控件實(shí)現(xiàn)的主要功能是，當(dāng)表單提交的時(shí)候檢查必填項(xiàng)是否正確填寫，同時(shí)根據(jù)需要驗(yàn)證輸入信息是否符合規(guī)范2012-08-08
Jquery插件easyUi表單驗(yàn)證提交(示例代碼)
本篇文章主要是對Jquery插件easyUi表單驗(yàn)證提交的示例代碼進(jìn)行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助2013-12-12
jquery實(shí)現(xiàn)點(diǎn)擊展開列表同時(shí)隱藏其他列表
這篇文章主要介紹了jquery實(shí)現(xiàn)點(diǎn)擊展開列表同時(shí)隱藏其他列表的方法,涉及jquery鼠標(biāo)事件及節(jié)點(diǎn)的遍歷與屬性操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-08-08
jquery彈層類代碼分享，大家參考使用吧2013-12-12
這篇文章主要為大家詳細(xì)介紹了jQuery事件對象的屬性和方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-09-09
jQuery實(shí)現(xiàn)監(jiān)聽下拉框選中內(nèi)容發(fā)生改變操作示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)監(jiān)聽下拉框選中內(nèi)容發(fā)生改變操作,結(jié)合實(shí)例形式分析了jQuery針對select選中觸發(fā)change事件相關(guān)操作技巧,需要的朋友可以參考下2018-07-07