前言:最近在学习react,在练习中模拟一个button通过AJAX向后台发送POST请求,懒得引入AXIOS,就顺便练习了js原生ajax。
正文:
注:我忽略了IE6及以下版本
submit(){
let data = this.props.value //这是要发送的数据
let xmlHttp = new XMLHttpRequest() //new XMLHttpRequest 对象
//发送请求
xmlHttp.open('POST', 'ajax_test.asp', true) //true是异步请求,false是同步的请求,不建议
xmlHttp.setRequestHeader('name', 'formData') //由于是提交form表单,最好set一个http头部。
xmlHttp.send(data) //只有在POST时候有参数,参数是string类型的数据,get方法并没有。
//接收相应 responseText 和 responseXML 属性
let response = xmlHttp.responseText
xmlHttp.onreadystatechange = function () {
if (xmlHttp.readyState === 4 && xmlHttp.status === 200) {
alert('成功'+ response)
}
}
}
一般项目中,还是使用Axios吧,比较方便。
原生js写Ajax
//原生js写ajax就像打电话 //打电话分下面4步//1.拿出手机//2.拨号//3.说话//4.挺对方说话 //ajax也分下面4步//1.创建ajax对象//2.连接到服务器//3.发送请求( ...
不借助jquery封装好的ajax,你能用js手写ajax框架吗
不借助jquery封装好的ajax,你能手写ajax框架吗?最基础的ajax框架,一起来围观吧. .创建XMLHttpRequest对象 var xhr = new XMLHttpRequest(); ...
利用js制作异步验证ajax方法()
如何利用js写ajax异步验证.代码如下: window.onload = function(){ var name = document.getElementById('register-name- ...
用原生JavaScript写AJAX
//原生js写ajax就像打电话 //打电话分下面4步//1.拿出手机//2.拨号//3.说话//4.听对方说话 //ajax也分下面4步//1.创建ajax对象//2.连接到服务器//3.发送请求( ...
使用PHP写ajax接口
使用PHP写ajax接口 之前有学过php都是前后端没有分离的,所以也想去了解后端是怎么写出ajax接口的,可能问了别人或者上网找了很多资料都很有有点懵,或者说直接用TP或者lavarel这些后端框架 ...
2019前端面试系列——JS高频手写代码题
实现 new 方法 /* * 1.创建一个空对象 * 2.链接到原型 * 3.绑定this值 * 4.返回新对象 */ // 第一种实现 function createNew() { let obj ...
js和jQuery以及ajax的小练习
今天学习了通过鼠标的点击事件然后让边框变颜色,还有怎么设置一个点击浏览器的输入框然后显示一个边框,还学习了通过ajak来获取post和get的值,通过它如何调用这个函数. 第一部分: 通过鼠标的点击让 ...
js、jQuery、ajax面试题
1.javascript的typeof返回哪些数据类型. 答案:string,boolean,number,undefined,function,object 2.例举3种强制类型转换和2种隐式类型转 ...
.net学习之Session、Cookie、手写Ajax代码以及请求流程
1.IIS 7 以上版本集成了两种模式,一种是经典模式,一种是集成模式(直接将asp.net框架集成到IIS中) 2.浏览器和服务器端通过什么技术来实现的?Socket(套接字),通信的语法是HTTP ...
随机推荐
snr ber Eb/N0之间的区别与联系
信噪比(S/N)是指传输信号的平均功率与加性噪声的平均功率之比,载噪比(C/N)指已经调制的信号的平均功率与加性噪声的平均功率之比,它们都以对数的方式来计算,单位为dB. 对同一个传输系统而言,载噪比 ...
ListView控件的列表项的文字不满一行的时候,如何实现点击该列表项的空白区域仍可触发列表项的点击事件
今天在做Demo的过程中,使用到了ListView.然而在实现过程中,发现一个出现了一个问题:只能点击列表项的文字区域可以触发点击事件,而点击列表项的空白区域无法触发点击事件. 如下图: listit ...
一个简单的Inno Setup例子
; 脚本由 Inno Setup 脚本向导 生成! ; 有关创建 Inno Setup 脚本文件的详细资料请查阅帮助文档! [Setup] ; 注: AppId的值为单独标识该应用程序. ; 不要为其 ...
Reporting Services 2: 参数化报表
http://www.cnblogs.com/waxdoll/archive/2006/07/16/452467.html
利用PowerShell 得到 进程总共占用的内存
$task = tasklist /nh /fo csv $total = 0 for($i=0; $i -lt $task.count; $i++) { $one = $task[ $i ].Spl ...
2016-wing的年度总结
大神们都爱写总结,为了早日成为大神,我也来写一波. 2016 有很多事情发生. 从日常生活来讲,生活水平得到了一定提升,从600一个月的村子搬到了800一个月的村子(/捂脸); 从就业环境来讲,许多人 ...
.net core程序中使用微软的依赖注入框架
我之前在博文中介绍过Asp.net core下系统自带的依赖注入框架,这个依赖框架在Microsoft.Extensions.DependencyInjection中实现,本身并不是.net core ...
BIOS备忘录之通过Windbg来追踪ASL code的运行
通过Windbg来追踪ASL code的运行: 目标机的配置: 第一步: 在BIOS Setup下面 disable secure boot(不然下面debug on 命令会失败):关闭防火墙. 第二 ...
项目Beta冲刺(团队)随笔集
凡事预则立 项目Beta冲刺准备 第一天 项目Beta冲刺(团队)第一天 第二天 项目Beta冲刺(团队)第二天 第三天 项目Beta冲刺(团队)第三天 第四天 项目Beta冲刺(团队)第四天 第五天 ...
如何设置Win7不待机 Win7进入待机状态会断网的解决方法
电脑一旦进入待机状态后,会断网,应用将停止运行,因此需要设置电脑不待机来解决,这种情况需要挂一些游戏或者下载应用的时非常实用,下面就与大家分享下电脑不待机的设置方法,感兴趣的朋友可以参考下 有时候我们 ...