如何使用ajax编程

前端之家收集整理的这篇文章主要介绍了如何使用ajax编程前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

如何使用ajax编程


step1,获得ajax对象

比如:

var xhr = getXhr();


step2,使用ajax对象发请求(get/post)

1)发送get请求

// 第一个参数:请求方式

//第二个参数:请求资源路径

//第三个参数:

//true->表示异步请求: ajax对象方式请求时,用户可以对页面做其他操作。

//false->表示同步请求:不能做其他操作,只能等待。

xhr.open('get','check_username.do?username=zs',true);

xhr.onreadystatechange = f1;

xhr.send(null);

示例代码链接http://www.jb51.cc/article/p-uuyanvbg-bhx.html

2)发送post请求

xhr.open('post','check_username.do',true);

//因为按照http协议的要求,发送post请求时,应该发送一个content-type消息头。

//而ajax对象默认情况下不会发送这个消息头,所以,需要调用setRequestHeader方法添加

xhr.setRequestHeader('content-type','application/x-www-form-urlencoded');

xhr.onreadystatechange = f1;

//请求参数要写在send方法

xhr.send('username=zs&age=12');

示例代码链接http://www.jb51.cc/article/p-ycmqkspp-bhx.html


step3,编写服务器端的处理程序

跟以前相比,有一点点改变,就是一般不需要返回一个完整的页面,只需要返回部分数据。


step4,编写事件处理函数

	function f1(){
		if(xhr.readState == 4){
			var txt = xhr.responseText;
			dom操作更新页面...
		}
	}
原文链接:https://www.f2er.com/ajax/162663.html

猜你在找的Ajax相关文章