JavaScript異步上傳圖片文件的實例代碼
更新時間：2017年07月04日 12:06:37 作者：小太陽Sunny
本文通過實例代碼給大家介紹了js異步上傳圖片文件的方法，包括html和jquery代碼，需要的的朋友參考下吧
html：
<form action="url" enctype="multipart/form-data" id="myform" method="post">
<input accept="image/*" id="addfile" type="file" />
</form>
jquery：
$("#addfile").on('change', function () {
var f = $(this).get(0).files[0];
var form = document.getElementById('myform');
var formData = new FormData(form);
formData.append('Filedata', f);
var xhr = new XMLHttpRequest();
xhr.addEventListener("load", uploadComplete, false);
xhr.addEventListener("error", uploadFailed, false);
xhr.open('POST', form.action);
xhr.send(formData);
});
function uploadComplete(evt)
{
var data=evt.target.responseText
}
function uploadFailed()
{
alert("上傳失??！請重試！");
}
以上所述是小編給大家介紹的JavaScript異步上傳圖片文件的實例代碼，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了JavaScript中的變量聲明，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2022-01-01
這篇文章主要介紹了JavaScript實現(xiàn)的選擇排序算法,結(jié)合實例形式分析了選擇排序的原理、實現(xiàn)步驟與相關(guān)操作技巧,需要的朋友可以參考下2017-04-04
本篇文章給大家詳細(xì)分析了javascript原型及原型鏈的相關(guān)知識點以及用法分享，有興趣的朋友參考下。2018-03-03
跟我學(xué)習(xí)javascript的循環(huán)
跟我學(xué)習(xí)javascript的循環(huán)，本文不僅針對javascript循環(huán)進行講解，還對prototype補充了幾點小tips，歡迎大家閱讀。2015-11-11
這里我們來解析瀏覽器端的AJAX緩存機制,來共同看一下AJAX緩存與HTTP緩存的關(guān)系以及AJAX緩存的刷新時間問題2016-06-06
JavaScript Scoping and Hoisting 翻譯
希望這篇文章能夠給JavaScript程序員最容易困惑的部分一些啟示。我盡力寫的全面，以免引起更多的困惑。如果我寫錯了或是漏掉了某些重要的東西，請一定讓我知道2012-07-07
這篇文章主要介紹了js獲取字符串字節(jié)數(shù)方法,實例總結(jié)了javascript字符串長度計算的相關(guān)技巧,需要的朋友可以參考下2015-06-06
Bootstrap框架的學(xué)習(xí)教程詳解(二)
Bootstrap，來自 Twitter，是目前最受歡迎的前端框架。本文給大家介紹Bootstrap框架的學(xué)習(xí)教程詳解，對bootstrap框架感興趣的朋友跟著小編一起學(xué)習(xí)吧2016-10-10
想必大家對參數(shù)傳遞并不陌生吧，本文為大家介紹下JS的參數(shù)傳遞,需要的朋友可以參考下2014-02-02
Bootstrap基本組件學(xué)習(xí)筆記之下拉菜單(7)
這篇文章主要為大家詳細(xì)介紹了Bootstrap基本組件學(xué)習(xí)筆記之下拉菜單,具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-12-12