1、Ajax 是 Asynchronous JavaScript and XML(以及 DHTML 等)的缩写
2、创建 XMLHttpRequest 对象,这是处理所有服务器通信的对象
<script language="javascript" type="text/javascript">
var xmlHttp = new XMLHttpRequest();
</script>
3、 // Get the value of the "phone" field and stuff it in a variable called phone
var phone = document.getElementById("phone").value;
// Set some values on a form using an array called response
document.getElementById("order").value = response[0];
document.getElementById("address").value = response[1];
4、浏览器:在 Microsoft 浏览器上创建了一个 XMLHttpRequest。
var xmlHttp = false;
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e2) {
xmlHttp = false;
}
}
5、以支持多种浏览器的方式创建 XMLHttpRequest 对象
/* Create a new XMLHttpRequest object to talk to the Web server */
var xmlHttp = false;
/*@cc_on @*/
/*@if (@_jscript_version >= 5)
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e2) {
xmlHttp = false;
}
}
@end @*/
if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
xmlHttp = new XMLHttpRequest();
}
6、发出 Ajax 请求
function callServer() {
// Get the city and state from the web form
var city = document.getElementById("city").value;
var state = document.getElementById("state").value;
// Only go on if there are values for both fields
if ((city == null) || (city == "")) return;
if ((state == null) || (state == "")) return;
// Build the URL to connect to
var url = "/scripts/getZipCode.php?city=" + escape(city) + "&state=" + escape(state);
// Open a connection to the server
xmlHttp.open("GET", url, true);
// Setup a function for the server to run when it's done
xmlHttp.onreadystatechange = updatePage;
// Send the request
xmlHttp.send(null);
}
7、处理服务器响应
function updatePage() {
if (xmlHttp.readyState == 4) {
var response = xmlHttp.responseText;
document.getElementById("zipCode").value = response;
}
}
分享到:
相关推荐
总结来说,AJAX封装函数是将复杂的HTTP请求过程简化为易于调用的函数,使得开发者能够更高效地实现异步通信。在实际开发中,这样的封装是非常常见的,它提高了代码的可读性和复用性,降低了开发难度。对于`right.js`...
Ajax-Bridge 提供了一些实用工具函数,比如错误处理、数据序列化和反序列化等。学习如何正确使用这些工具,可以提高我们的开发效率,同时保证代码的健壮性。例如,数据序列化可以将JavaScript对象转换为适合发送到...
对ajax基础的封装
**Ajax基础实例详解** AJAX,全称"Asynchronous JavaScript and XML",是一种使用JavaScript技术实现异步通信,更新网页局部内容的技术,无需刷新整个页面。它通过创建XMLHttpRequest对象,发送HTTP请求,然后在...
**标题解析:** "自己用的简单封装AJAX类" 指的是作者为了个人使用需求,编写了一个简化的AJAX处理类。AJAX(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术,...
uni-app 自己封装的utils.js 常用工具类(封装的ajax,上传,查看文档,富文本解析)
总的来说,"ajax-demo-java EE"项目提供了一个基础的Ajax应用实例,涵盖了从客户端的JavaScript到服务器端的Java代码,展示了如何在Java EE环境中实现按需加载数据的功能。通过对这个项目的学习,开发者可以深入理解...
**Ajax-XML-ASP.NET 读存数据基础代码解析** 在Web开发中,Ajax(Asynchronous JavaScript and XML)技术常用于实现页面的无刷新更新,提高用户体验。此压缩包中的代码示例着重展示了如何在ASP.NET环境中利用Ajax与...
- 提供一个通用的Ajax函数,接收URL、数据、回调函数等参数,减少代码重复。 - 错误处理,添加try...catch语句块,捕获并处理可能出现的错误。 - 支持JSONP,用于跨域请求。 - 使用Promise或async/await来处理...
封装函数 ```javascript function ajax(url, onsuccess, onfail) { var xmlhttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP'); xmlhttp.open("POST", url, true);...
8. "Util.js":这是一个可能包含实用函数的JavaScript文件,可能包括对AJAX操作的封装,是实际开发中常见的工具类库。 综上所述,学习和掌握AJAX的使用以及JavaScript的类库封装,不仅需要理解JavaScript的基本概念...
1. **$.ajax()**:这是jQuery提供的核心Ajax方法,可以配置各种参数,如URL、请求类型(GET或POST)、数据类型(JSON、XML等)以及回调函数。它支持同步和异步请求,通常用于复杂的Ajax交互。 2. **$.get()** 和 **...
**Ajax(Asynchronous JavaScript and XML)**是一种在无需重新加载整个网页的情况下,能够更新部分...同时,随着技术的发展,现代前端框架如React、Vue等也提供了更高级的Ajax封装,使得异步数据交互变得更加便捷。
在函数内部,我们需要创建一个新的XMLHttpRequest对象,这是进行Ajax请求的基础。 ```javascript var xhr = new XMLHttpRequest(); ``` 3. **设置请求参数** 根据提供的选项,我们需要设置请求的相关属性,如请求...
Ajax封装则是将常见的Ajax操作进行模块化处理,方便开发者在项目中快速、高效地实现数据交互。本篇文章将深入探讨Ajax封装实例代码及其相关知识点。 首先,我们来看Ajax的核心原理:通过JavaScript创建...
当我们需要在多个地方重复使用相同的请求逻辑时,可以创建一个封装函数。例如,如果我们经常需要向同一个API发送GET请求,可以这样封装: ```javascript function fetchData(url, callback) { $.ajax({ url: url,...
Ajax封装则是将Ajax交互过程中的多种操作整合到一个函数或对象中,以便于开发者更方便、高效地使用。这个“ax封装.rar”可能是一个自定义的JavaScript库或者模块,它对原生的Ajax功能进行了封装,提高了代码的可复用...
这里的`ajaxGet`函数接受一个URL和回调函数作为参数,当请求完成并成功时,回调函数会被调用,传入服务器返回的数据。 **3. 封装Ajax POST请求** POST请求常用于向服务器发送数据,如表单提交。封装POST请求的代码...
在开发小程序或者移动端应用时,数据交互通常依赖于Ajax技术,它使得前端可以与服务器进行异步通信...在实际开发中,还可以根据项目的具体需求进一步扩展和完善这个封装的Ajax函数,比如添加超时处理、网络错误处理等。