由于项目中需要在提交ajax前设置header信息，jquery的ajax实现不了，我们自己封装几个常用的ajax方法。
jQuery的ajax普通封装
原生ajax封装，设置header，传json
获取成功后执行操作
//数据在xhr.responseText
var resJson = JSON.parse(xhr.responseText)
cb(resJson);
}
};
xhr.open("post",uri,true);
xhr.setRequestHeader("DeviceCode","56");
xhr.setRequestHeader("Source","API");
xhr.setRequestHeader("Authentication","72b32a1f754ba1c09b3695e0cb6cde7f");
xhr.setRequestHeader("Content-Type","application/json");
var dataStr = JSON.stringify(data);
xhr.send(dataStr);
}
原生ajax封装，设置header，传json
获取成功后执行操作
//数据在xhr.responseText
var resJson = JSON.parse(xhr.responseText)
cb(resJson);
}
};
xhr.open("post","72b32a1f754ba1c09b3695e0cb6cde7f");
xhr.onload = function() {
console.log("上传完成!");
};
xhr.send(formObj);
}
导入的实现部分是后端的事情。
我们这里需要提交一个excel文件，使用ajax。
并且需要设置ajax的头信息。所以我们不使用封装好的插件。用原生js来封装一个ajaxFormFn() 方法。
这里用到两个对象：
第一个对象：FormData
第二个对象：XMLHttpRequest
目前新版的Firefox 与 Chrome 等支持HTML5的浏览器完美的支持这两个对象，但IE9尚未支持 FormData 对象，还在用IE6 ? 只能仰天长叹....
以上所述是小编给大家介绍的原生JS封装ajax 传json，str，excel文件上传提交表单(推荐)的相关知识。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助，如果觉得编程之家不错，可分享给好友！感谢支持。
原文链接：https://www.f2er.com/ajax/47707.html