Ajax異步上傳文件實(shí)例代碼分享
非常不多說(shuō),直接給大家上干貨,寫(xiě)的不好還請(qǐng)見(jiàn)諒。
具體代碼如下所示:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<title>Index</title>
<script>
$(function() {
$(':button').click(function () {
var formData = new FormData();
var file = $("input[type='file']")[0].files[0];
formData.append("files", file);
$.ajax({
url: '/Upload/Upload', //server script to process data
type: 'POST',
//Ajax事件
//beforeSend: beforeSendHandler,
//success: completeHandler,
//error: errorHandler,
// Form數(shù)據(jù)
data: formData,
//Options to tell JQuery not to process data or worry about content-type
cache: false,
contentType: false,
processData: false
});
});
});
</script>
</head>
<body>
<form enctype="multipart/form-data">
<input name="file" type="file" multiple="multiple" />
<input type="button" value="Upload" />
<input type="text" name="userName" value="ice" />
</form>
</body>
</html>
以上代碼是小編給大家分享的Ajax異步上傳文件實(shí)例代碼,希望對(duì)大家有所幫助,如果大家有疑問(wèn)歡迎給我留言,小編會(huì)及時(shí)回復(fù)大家的,在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
Ajax讀取數(shù)據(jù)到表格的實(shí)現(xiàn)代碼
前兩篇我們講了"ajax開(kāi)始的準(zhǔn)備"與及如何使用ajax技術(shù)進(jìn)行簡(jiǎn)單的數(shù)據(jù)讀?。裉煳覀円v的是:使用Ajax無(wú)刷新技術(shù)讀取服務(wù)端多條數(shù)據(jù),并將返回的數(shù)據(jù)顯示到一個(gè)表格內(nèi).2010-08-08
Ajax與JSON的一些學(xué)習(xí)總結(jié)
Ajax技術(shù)的核心是XMLHttpRequest對(duì)象(簡(jiǎn)稱XHR),可以通過(guò)使用XHR對(duì)象獲取到服務(wù)器的數(shù)據(jù),然后再通過(guò)DOM將數(shù)據(jù)插入到頁(yè)面中呈現(xiàn)。雖然名字中包含XML,但Ajax通訊與數(shù)據(jù)格式無(wú)關(guān),所以我們的數(shù)據(jù)格式可以是XML或JSON等格式2012-08-08
ajax中的async屬性值之同步和異步及同步和異步區(qū)別
在Jquery中ajax方法中async用于控制同步和異步,當(dāng)async值為true時(shí)是異步請(qǐng)求,當(dāng)async值為fase時(shí)是同步請(qǐng)求。ajax中async這個(gè)屬性,用于控制請(qǐng)求數(shù)據(jù)的方式,默認(rèn)是true,即默認(rèn)以異步的方式請(qǐng)求數(shù)據(jù)。2015-10-10
使用Ajax模仿百度搜索框的自動(dòng)提示功能實(shí)例
今天小編就為大家分享一篇使用Ajax模仿百度搜索框的自動(dòng)提示功能實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-02-02
解決spring mvc 返回json數(shù)據(jù)到ajax報(bào)錯(cuò)parseerror問(wèn)題
最近使用ajax接收spring mvc傳過(guò)來(lái)的json數(shù)據(jù)時(shí)總是出現(xiàn)parseerror的錯(cuò)誤,下面通過(guò)本文給大家分享spring mvc 返回json數(shù)據(jù)到ajax報(bào)錯(cuò)parseerror問(wèn)題的解決方法,需要的朋友參考下吧2017-05-05
ajax怎么打開(kāi)新窗口具體如何實(shí)現(xiàn)
本文為大家介紹下ajax如何打開(kāi)新窗口,下面有段代碼,需要的朋友可以了解下2014-01-01
Jquery版本導(dǎo)致Ajax不執(zhí)行success回調(diào)函數(shù)
這篇文章主要介紹了Jquery Ajax不執(zhí)行success回調(diào)函數(shù)的原因及解決方法2014-04-04
菜鳥(niǎo)蔡之Ajax復(fù)習(xí)第二篇(JQuery中的load()方法實(shí)現(xiàn)Ajax功能)
在上一篇博客中寫(xiě)到的是在傳統(tǒng)的Javascript中使用XMLHttpRequest對(duì)象異步加載數(shù)據(jù)的,唉,童鞋.......看到那些代碼是不是有點(diǎn)頭疼啊!呵呵......2012-11-11

