`
chengyu2099
  • 浏览: 473089 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

ajax -基础未封装-参数函数说明

阅读更多
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;
	  }
	}
分享到:
评论

相关推荐

    JS封装的AJAX函数

    总结来说,AJAX封装函数是将复杂的HTTP请求过程简化为易于调用的函数,使得开发者能够更高效地实现异步通信。在实际开发中,这样的封装是非常常见的,它提高了代码的可读性和复用性,降低了开发难度。对于`right.js`...

    ajax-bridge 以及它在web中的应用

    Ajax-Bridge 提供了一些实用工具函数,比如错误处理、数据序列化和反序列化等。学习如何正确使用这些工具,可以提高我们的开发效率,同时保证代码的健壮性。例如,数据序列化可以将JavaScript对象转换为适合发送到...

    ajax封装函数

    对ajax基础的封装

    Ajax-Ajax基础实例

    **Ajax基础实例详解** AJAX,全称"Asynchronous JavaScript and XML",是一种使用JavaScript技术实现异步通信,更新网页局部内容的技术,无需刷新整个页面。它通过创建XMLHttpRequest对象,发送HTTP请求,然后在...

    自己用的简单封装AJAX类

    **标题解析:** "自己用的简单封装AJAX类" 指的是作者为了个人使用需求,编写了一个简化的AJAX处理类。AJAX(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术,...

    uni-app 自己封装的utils.js

    uni-app 自己封装的utils.js 常用工具类(封装的ajax,上传,查看文档,富文本解析)

    ajax-demo-java EE

    总的来说,"ajax-demo-java EE"项目提供了一个基础的Ajax应用实例,涵盖了从客户端的JavaScript到服务器端的Java代码,展示了如何在Java EE环境中实现按需加载数据的功能。通过对这个项目的学习,开发者可以深入理解...

    ajax-xml-aspnet读存数据基础代码

    **Ajax-XML-ASP.NET 读存数据基础代码解析** 在Web开发中,Ajax(Asynchronous JavaScript and XML)技术常用于实现页面的无刷新更新,提高用户体验。此压缩包中的代码示例着重展示了如何在ASP.NET环境中利用Ajax与...

    java中对ajax经典封装

    - 提供一个通用的Ajax函数,接收URL、数据、回调函数等参数,减少代码重复。 - 错误处理,添加try...catch语句块,捕获并处理可能出现的错误。 - 支持JSONP,用于跨域请求。 - 使用Promise或async/await来处理...

    ajax代码及简单封装

    封装函数 ```javascript function ajax(url, onsuccess, onfail) { var xmlhttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP'); xmlhttp.open("POST", url, true);...

    web ajax 的使用 js封装

    8. "Util.js":这是一个可能包含实用函数的JavaScript文件,可能包括对AJAX操作的封装,是实际开发中常见的工具类库。 综上所述,学习和掌握AJAX的使用以及JavaScript的类库封装,不仅需要理解JavaScript的基本概念...

    ajax-jquery-demo

    1. **$.ajax()**:这是jQuery提供的核心Ajax方法,可以配置各种参数,如URL、请求类型(GET或POST)、数据类型(JSON、XML等)以及回调函数。它支持同步和异步请求,通常用于复杂的Ajax交互。 2. **$.get()** 和 **...

    Ajax---简单实例

    **Ajax(Asynchronous JavaScript and XML)**是一种在无需重新加载整个网页的情况下,能够更新部分...同时,随着技术的发展,现代前端框架如React、Vue等也提供了更高级的Ajax封装,使得异步数据交互变得更加便捷。

    my-ajax-imitate-jq_ajax_JQ_

    在函数内部,我们需要创建一个新的XMLHttpRequest对象,这是进行Ajax请求的基础。 ```javascript var xhr = new XMLHttpRequest(); ``` 3. **设置请求参数** 根据提供的选项,我们需要设置请求的相关属性,如请求...

    ajax封装实例代码

    Ajax封装则是将常见的Ajax操作进行模块化处理,方便开发者在项目中快速、高效地实现数据交互。本篇文章将深入探讨Ajax封装实例代码及其相关知识点。 首先,我们来看Ajax的核心原理:通过JavaScript创建...

    jquery ajax方法的再封装

    当我们需要在多个地方重复使用相同的请求逻辑时,可以创建一个封装函数。例如,如果我们经常需要向同一个API发送GET请求,可以这样封装: ```javascript function fetchData(url, callback) { $.ajax({ url: url,...

    ax封装.rar-ajax封装.txt

    Ajax封装则是将Ajax交互过程中的多种操作整合到一个函数或对象中,以便于开发者更方便、高效地使用。这个“ax封装.rar”可能是一个自定义的JavaScript库或者模块,它对原生的Ajax功能进行了封装,提高了代码的可复用...

    ajaxTest 实用简单封装

    这里的`ajaxGet`函数接受一个URL和回调函数作为参数,当请求完成并成功时,回调函数会被调用,传入服务器返回的数据。 **3. 封装Ajax POST请求** POST请求常用于向服务器发送数据,如表单提交。封装POST请求的代码...

    3-11 定义全局路径和封装Ajax(移动端) - EMOS小程序1

    在开发小程序或者移动端应用时,数据交互通常依赖于Ajax技术,它使得前端可以与服务器进行异步通信...在实际开发中,还可以根据项目的具体需求进一步扩展和完善这个封装的Ajax函数,比如添加超时处理、网络错误处理等。

Global site tag (gtag.js) - Google Analytics