由于项目中需要在提交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
原生ajax封装,设置header,传上传excel文件,提交表单
获取成功后执行操作
//数据在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 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持。