我们先来看看国内外对ajax的解释:
百度百科:
AJAX 指异步JavaScript及XML(Asynchronous JavaScript And XML)。
国内翻译常为“阿贾克斯”和阿贾克斯足球队同音。Web应用的交互如Flickr,Backpack和Google在这方面已经有质的飞跃。这个术语源自描述从基于Web的应用到基于数据的应用的转换。在基于数据的应用中,用户需求的数据如联系人列表,可以从独立于实际网页的服务端取得并且可以被动态地写入网页中,给缓慢的Web应用体验着色使之像桌面应用一样。
Ajax的核心是JavaScript对象XmlHttpRequest。该对象在Internet Explorer 5中首次引入,它是一种支持异步请求的技术。简而言之,XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应,而不阻塞用户。
国内翻译常为“阿贾克斯”和阿贾克斯足球队同音。Web应用的交互如Flickr,Backpack和Google在这方面已经有质的飞跃。这个术语源自描述从基于Web的应用到基于数据的应用的转换。在基于数据的应用中,用户需求的数据如联系人列表,可以从独立于实际网页的服务端取得并且可以被动态地写入网页中,给缓慢的Web应用体验着色使之像桌面应用一样。
Ajax的核心是JavaScript对象XmlHttpRequest。该对象在Internet Explorer 5中首次引入,它是一种支持异步请求的技术。简而言之,XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应,而不阻塞用户。
维基百科:
AJAX即“Asynchronous JavaScript and XML”(异步的JavaScript与XML技术),指的是一套综合了多项技术的浏览器端网页开发技术。Ajax的概念由Jesse James Garrett所提出[1]。
传统的Web应用允许用户端填写表单(form),当提交表单时就向Web服务器发送一个请求。服务器接收并处理传来的表单,然后送回一个新的网页,但这个做法浪费了许多带宽,因为在前后两个页面中的大部分HTML码往往是相同的。由于每次应用的沟通都需要向服务器发送请求,应用的回应时间依赖于服务器的回应时间。这导致了用户界面的回应比本机应用慢得多。
与此不同,AJAX应用可以仅向服务器发送并取回必须的数据,它使用SOAP或其它一些基于XML的页面服务接口(接口),并在客户端采用JavaScript处理来自服务器的回应。因为在服务器和浏览器之间交换的数据大量减少(大约只有原来的5%)。结果,我们感觉服务器回应更快了。同时,很多的处理工作可以在发出请求的客户端机器上完成,因此Web服务器的负荷也减少了。
传统的Web应用允许用户端填写表单(form),当提交表单时就向Web服务器发送一个请求。服务器接收并处理传来的表单,然后送回一个新的网页,但这个做法浪费了许多带宽,因为在前后两个页面中的大部分HTML码往往是相同的。由于每次应用的沟通都需要向服务器发送请求,应用的回应时间依赖于服务器的回应时间。这导致了用户界面的回应比本机应用慢得多。
与此不同,AJAX应用可以仅向服务器发送并取回必须的数据,它使用SOAP或其它一些基于XML的页面服务接口(接口),并在客户端采用JavaScript处理来自服务器的回应。因为在服务器和浏览器之间交换的数据大量减少(大约只有原来的5%)。结果,我们感觉服务器回应更快了。同时,很多的处理工作可以在发出请求的客户端机器上完成,因此Web服务器的负荷也减少了。
ajax的技术用我自己的话就是几种技术的整合,最后实现了网页交互的异步!这是个质的飞跃,量达到了一定的程度,简单的组合整理就会有全然不同的结果,现在咱们在项目中看看ajax的实战教程:
实现效果:答卷的时候异步写答题记录
实现技术:ajax
技术前提:ajax,jquery,.net,sql
难点:动态控件,控件组合,ajax交互
实现概念图:
代码实现:
动态控件关键代码:
radioButton.Attributes.Add("onclick","javascript:AnswerSingleSelectQuestion('" + strSingleSelectionRecordTableName + "','" + StudentId + "','" + ExamId + "','" + Convert.ToInt32(dr["questionId"]) + "','" + dr["correctAnswer"].ToString() + "','" + option + "','" + Convert.ToDouble(dr["fraction"].ToString()) + "')");
//更新判断题、单选题答题记录 function AnswerSingleSelectQuestion(tableName,studentId,examId,questionId,ReferAnswer,examAnswer,fraction) { //把参考答案和答写的答案转换成汉字 ReferAnswer = decodeURIComponent(ReferAnswer); examAnswer = decodeURIComponent(examAnswer); //获取时间戳 var timestamp = (new Date()).valueOf(); $.ajax({ url: "ExamAnswerDeal.ashx",data: { "tableName": tableName,"studentId": studentId,"examId": examId,"questionId": questionId,"ReferAnswer": ReferAnswer,"examAnswer": examAnswer,"fraction": fraction,"Event": "Update","timestamp": timestamp },dataType: "text",type: "POST",success: function (data,textStatus) { },error: function (XMLHttpRequest,textStatus,errorThrown) { //alert("答题失败,请联系管理员!"); //存cookie SaveAnswerToCookie(studentId,tableName,"Update",fraction,"",""); } }); }
一般处理程序关键代码:
public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; //获取事件标志位 string strEvent = context.Request.Form["Event"].ToString(); //答题记录实体 QuestionsRecordsEntity EntityQuestionRecords = new QuestionsRecordsEntity(); EntityQuestionRecords.TableName = context.Request.Form["tableName"].ToString();//表名 EntityQuestionRecords.StudentId = context.Request.Form["studentId"].ToString();//学生ID EntityQuestionRecords.ExamId = Convert.ToInt64(context.Request.Form["examId"].ToString());//考试Id EntityQuestionRecords.QuestionId = Convert.ToInt32(context.Request.Form["questionId"].ToString());//题号 EntityQuestionRecords.ReferAnswer = context.Request.Form["referAnswer"].ToString(); //正确答案 string strExamAnswer = context.Request.Form["examAnswer"].ToString();//考生答案 double dblFraction = Convert.ToDouble(context.Request.Form["fraction"]); //选择题 if (strEvent == "Update") { //答题记录实体赋值 EntityQuestionRecords.EXAMANSWER = strExamAnswer; //如果该考生答对了试题,就得到满分,否则得到零分 if (EntityQuestionRecords.ReferAnswer == strExamAnswer) { EntityQuestionRecords.Fraction = dblFraction; } else { EntityQuestionRecords.Fraction = 0; } //EntityQuestionRecords.isCheck = "是"; //更新答题记录 BllExamManage.ModifyOneQuestionRecord(EntityQuestionRecords); context.Response.Write("true"); } }
$.ajax() 是在jquery中封装好的ajax代码,他用一定的格式约束我们使用ajax,同时也极大的方便了用户的代码写作!不得不说,面向对象的设计理念现在是深入到了开发的每个角落!
总结:由此我们可见,一种好的思想,在代码的世界中会找到合适的实现,只有想不到,没有做不到,今天这个互联网时代也是就已经实现,在做项目中重要的不是关心技术环节,而要关心这一层层关系背后的关系!
原文链接:https://www.f2er.com/ajax/165399.html