博客列表 >Ajax基本知识

Ajax基本知识

指纹指恋的博客
指纹指恋的博客原创
2018年03月04日 10:13:38546浏览

Ajax本质:在页面不刷新的情况下,利用XMLHttpRequest发送HTTP请求,可以看做JS的网络化

function vote(){
	//1、创建XMLHttpRequest对象
	var xhr = new XMLHttpRequest();	
	//2、打开连接,第一个参数表弟传值方式,第二个表示请求哪个页面进行处理,true表示异步,false表示同步	
	xhr = open('GET','./test.php',true);
	//3、发送请求	
	xhr.send(null);
	//4、输出返回值	
	alert(xhr.responseText);
}
  • Ajax同步表示发送完请求之后,要等到xhr.responseText拿到返回值才执行第四步,而异步是执行完发送请求后,直接执行第四步,并不需要等待,也不关心xhr.responseText是否拿到返回值

  • 如果使用异步方式,如何知道请求发送完成这个状态呢?这就需要使用onreadystatechange这个属性进行绑定回调函数了

xhr.onreadystatechange = function (){
    alert('请求成功');
}
  • Ajax不能实现文件上传,因为其调用的XMLHttpRequest对象是属于JS的,但是出于安全考虑JS的对象不能访问本地文件

使用POST方式进行传值

function vote(){
	//1、创建XMLHttpRequest对象
	var xhr = new XMLHttpRequest();	
	//2、打开连接		
	xhr = open('POST','./test.php',true);
	//3、收集表单数据
	var uname = document.getElementById('uname').value;
	var email = document.getElementById('email').value;
	//4、发送请求	
	xhr.setRequestHeader('content-type','application/x-www-form-urlencoded')
	xhr.send('username='+uname+'&email='=email);
	//5、输出返回值	
	alert(xhr.responseText);
}
Ajax返回类型值XML类型


声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议