`

ajax初步开发结构

    博客分类:
  • UI
阅读更多
<script type="text/javascript">
<!--

	var http_request = false;
	
	//:一号线:创建AJAX引擎
	function send_request(url){//初始化,指定处理函数,发送请求的函数

		http_request = false;
		
		//开始初始化XMLHttpRequest对象--ajax引擎
		if(window.XMLHttpRequest){ //Mozilla浏览器
			http_request=new XMLHttpRequest();
			if(http_request.overrideMimeType){//设置Mime类别
				http_request.overrideMimeType("text/xml");
			}
		}else if(window.ActiveXObject){//IE浏览器
			try{
				http_request=new ActiveXObject("Msxml2.XMLHTTP");
			}catch(e){
				try{
					http_request=new ActiveXObject("Microsoft.XMLHTTP");
				}catch(e){}
			}
		}
		if(!http_request){//异常,创建对象实例失败
			window.alert("不能创建XMLHttpRequest对象实例。");
			return false;
		}
		//ajax引擎准备结束
		//程序继续下行--表示ajax引擎创建成功
		
		//时刻准备处理从服务器返回的数据
		//状态改变触发器--状态一旦改变就会触发回调函数执行
		http_request.onreadystatechange=processRequest;
		//ajax引擎有哪四个状态
			//0-未初始化
			//1-读取中
			//2-已读取
			//3-交互中
			//4-完成--服务器已传回所有信息
		
		//打开请求+必要参数
		http_request.open("GET",url,true);
		//发送请求
		http_request.send(null);
		
	}
	
	//处理服务器返回的数据
	function processRequest(){
		if(http_request.readyState==4){//表示服务器已经传回所有信息
  //此时如果ajax请求的资源不存在 return HTTP Status 404 字符串,错误
			if(http_request.status==200){//表示返回的页面正常,可以开始处理
				alert(http_request.responseText);
				/**
				数据已经回调完毕,开始处理页面接收问题
				*/
				
			}else{//页面不正常,比如status==400的状况
				alert("您所请求的页面有异常。");
			}
		}
	}
	
</script>
分享到:
评论

相关推荐

    php+easyui DataGrid+ajax实例开发

    7. **测试与优化**:完成初步开发后,进行功能测试和性能优化,确保所有操作都能正确执行,且界面响应快速、用户体验良好。 这个实例将帮助开发者掌握PHP、EasyUI和Ajax的结合应用,提升Web应用的开发效率和用户...

    开发基于Struts Spring Hibernate Ajax的网上信息发布平台(Struts Hibernate Spring Ajax)--Chapter1

    最后,我们将引入Ajax,实现初步的客户端交互功能。 在这个过程中,你将学习到如何使用Struts的拦截器来添加全局行为,如登录验证;如何利用Spring的AOP进行权限控制;以及如何利用Ajax和JSON进行前后端通信。这将...

    ajax开发(pdf)

    - **一个初步的开发框架**:封装以上步骤,形成可复用的AJAX请求模式。 ##### 7.3、简单的示例 - **数据校验**:利用AJAX实时检查输入数据的有效性。 - **级联菜单**:根据用户选择动态加载下一级菜单。 #### 7.4...

    AJAX开发简略(含续一).pdf

    5. **一个初步的开发框架**:构建基本的AJAX通信流程,包括错误处理和数据展示。 ##### 7.3、简单的示例 示例包括数据校验、级联菜单等功能,这些示例展示了如何利用AJAX技术在不刷新页面的情况下,动态地更新网页...

    AJAX开发简略,10分钟学会

    - **一个初步的开发框架**:包括创建XMLHttpRequest对象、设置请求参数、处理响应等功能。 ##### 7.3、简单的示例 - **数据校验**:使用AJAX监听表单输入字段,在用户输入时发送异步请求到服务器,验证数据有效性...

    Ajax+nodemon+axios等初步了解

    这些文件对项目本身不是必需的,但在IDE中工作时有助于保持项目结构和设置的一致性。 "原生Ajax"文件可能包含关于如何使用JavaScript原生方法(如XMLHttpRequest对象)进行Ajax通信的信息。原生Ajax虽然不如库和...

    ajax网页设计+CSS设计

    CSS设计则是关于网页样式和布局的,它定义了网页元素的外观、布局和结构。通过CSS,开发者可以控制字体、颜色、间距、排列方式等视觉特性,实现跨浏览器的一致性。CSS有以下关键概念: 1. 选择器:如类选择器(....

    AJAX开发简略(含续一)_(可复制里面的文本、代码)

    5. **一个初步的开发框架**:通常会封装这些基本步骤,简化开发流程。 ### 示例 #### 数据校验 ```javascript function validateForm() { var xhr = new XMLHttpRequest(); xhr.open("POST", "/validate", true)...

    PHP TO ASP.NET 2.0开发系列课程(3):PHP深入编程之AJAX应用

    通过本课程的学习,开发者不仅能掌握PHP中的AJAX应用,还能对ASP.NET 2.0有初步了解,为进一步跨平台开发打下基础。提供的资源包括PPT、视频教程、文档和示例代码,为自学者提供了丰富的学习材料。强烈建议学员结合...

    AJAX 源码范例

    09/9.5.1.html 表格操作范例 09/9.5.5.html 添加单元格范例 09/9.5.8.html 删除行和单元格范例 09/9.5.9.html 交换两行的位置范例 &lt;br&gt;第10章 10/10.1.3.html CSS在Ajax开发中的作用...

    html5 Ajax表单验证实例.rar

    1. **HTML结构**:使用HTML5的表单元素,如`&lt;form&gt;`、`&lt;input&gt;`、`&lt;button&gt;`等,设置相应的属性进行初步的客户端验证。 2. **JavaScript事件处理**:通过监听表单的提交事件,比如`onsubmit`,阻止默认的表单提交...

    Struts2与Ajax结合输入验证[包含功能代码段]

    Struts2是一个强大的MVC框架,它为Java Web应用程序提供了结构化的开发模式。Ajax(Asynchronous JavaScript and XML)则是一种在无需刷新整个页面的情况下更新部分网页的技术,它极大地提升了用户体验。将Struts2与...

    很不错得ajax课件

    5. **一个初步的开发框架**:结合以上步骤,形成一个基本的AJAX开发流程。 #### 7.3 简单的示例 - **数据校验**:通过AJAX发送请求到服务器验证输入的数据。 - **级联菜单**:根据用户的选择动态加载相关选项。 #...

    ajax的好好东西

    并非所有用户请求都需要直接提交至服务器,例如数据验证和初步处理等任务可由Ajax引擎本地完成,仅在确实需要从服务器获取新数据时,才由Ajax引擎代表用户向服务器发起请求。这种方式减少了不必要的网络通信,提高了...

    三层结构开发的新闻发布系统

    3层结构开发的新闻发布系统。 在管理入口里管理员可以管理新闻类别,管理新闻内容,管理新闻评论。 普通游客可以查看热点新闻、最新新闻,搜索新闻,添加新闻评论。 内含验证码生成,jQuery的初步认识及Ajax回传更新...

    AJAX操作XML

    在上一章节的学习过程中,我们对AJAX的工作原理有了初步的认识,但上一章节的例子并未涉及到AJAX中一个重要的组成部分——XML。因此,本章节将详细介绍如何利用AJAX来操作XML数据。 #### 创建XMLHttpRequest对象 ...

    ssh+ajax电子商城毕设

    本设计项目的主要目的是通过灵活运用Java EE技术Struts、Spring和Hibernate等,掌握项目开发技术,初步了解软件工程项目开发流程,并通过团队合作完成网上电子商城的功能。 一、设计目的与要求 本设计的主要目的有...

Global site tag (gtag.js) - Google Analytics