AJAX简单应用
提到ajax大家都很清楚,其主要的作用就是异步提交数据。基本上所有的ajax应用程序都有雷同的流程:
1、从 Web 表单中获取需要的数据。
2、建立要连接的 URL。 3、打开到服务器的连接。 4、设置服务器在完成后要运行的函数。 5、发送请求。 下面简单介绍上面流程的实现过程: 1.基本上实现异步操作主要是靠操作一个对象,即XMLHttpRequest对象。所以首先应该建立并实例化一个 XMLHttpRequest对象:var xmlHttp=new XMLHttpRequest object; 2.获取web界面要传递的数据,这个很简单,如下: var city = document.getElementById("city").value; 3.发出ajax请求: 1)// 建立URL连接 var url = "/scripts/getZipCode.php?city=" + escape(city) 2)//打开URL连接,其中的参数:第一个为提交方式(get/post);第二个为连接到服务器的地址;第三 个为是否为异步操作,为true表示为异步,为false表示同步,发送请求后必须等到回复才能 xmlHttp.open("GET",url,true); 3)// 设置回调函数,即发送成功后调用的函数 xmlHttp.onreadystatechange = updatePage; 4)// 发送请求 xmlHttp.send(null); 4.处理服务器的相应(此为回调函数中对服务器 发送回来的数据的处理) function updatePage() { if (xmlHttp.readyState == 4) { var response = xmlHttp.responseText; document.getElementById("zipCode").value = response; } } // 解释:上面有一个属性readyState,为状态码,其值有5个(0,1,2,3,4)为4表示相应服务器的操作应经完 成,可以获取并使用服务器的响应了 总结:自我认为ajax的操作基本上就是这些,其遵循上面的几个步骤:实例化XMLHttpRequest对象,获取连接地址及传送数据,打开连接地址,设置回调函数,发送请求。如果有什么不足的地方,望大鸟指正。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |