Ajax 是什么? 如何创建一个Ajax?

Ajax 是什么? 如何创建一个Ajax?,第1张

Ajax并不算是一种新的技术,全称是asychronous javascript and
xml,可以说是已有技术的组合,主要用来实现客户端与服务器端的异步通信效果,实现页面的局部刷新,早期的浏览器并不能原生支持ajax,可以使用隐藏帧(iframe)方式变相实现异步效果,后来的浏览器提供了对ajax的原生支持
使用ajax原生方式发送请求主要通过XML>

Ajax 简介

Ajax 由 HTML、JavaScript™ 技术、DHTML 和 DOM 组成,这一杰出的方法可以将笨拙的 Web 界面转化成交互性的 Ajax 应用程序。本文的作者是一位 Ajax 专家,他演示了这些技术如何协同工作 —— 从总体概述到细节的讨论 —— 使高效的 Web 开发成为现实。他还揭开了 Ajax 核心概念的神秘面纱,包括 XML>

五年前,如果不知道 XML,您就是一只无人重视的丑小鸭。十八个月前,Ruby 成了关注的中心,不知道 Ruby 的程序员只能坐冷板凳了。今天,如果想跟上最新的技术时尚,那您的目标就是 Ajax。

但是,Ajax 不仅仅 是一种时尚,它是一种构建网站的强大方法,而且不像学习一种全新的语言那样困难。

一、业务需求

在开发中,当一个列表页面加载完成后,我需要根据列表每一项的id去服务器端获取对应的数据然后再把获取的数据赋给当前id对应的标签。

例如如下表格:

我有一系列的商品编号,我需要根据商品编号通过ajax到服务器获取商品对应的名称,然后再用js更新界面(实际中的业务当然不是获取商品名称这么简单)

二、实现方案

21 错误方案

一般情况下,我们会直接想到,直接写个for循环,在循环内发起ajax请求获取数据,再把获取的数据更新到对应的id对应的标签上,

如下:

我们以数组模拟一些列id:

var array = [1, 3, 2, 5, 3];  

循环的ajax请求方法:

function foreach_ajax() {  for (var i = 0; i < arraylength; i++) {  $get("/home/loop_ajax", { value: array[i] }, function (data) {  consolelog(array[i]+","+data);  });  }  }  

调用:

$(function () {  foreach_ajax();   });  

测试结果如下:

我们可以看到,在循环的内部我们根本取不到array[i]的值。

导致这种结果的原因是:ajax是异步执行的,在循环结束的时候第一次ajax还没有将服务器数据返回,而循环结束的时候for中的变量i已经释放了,所以array[i]=undefined

22 正确方案

正确的方式是以递归的方式循环ajax。

如下:

我们以数组模拟一些列id:

var array = [1, 3, 2, 5, 3];  

递归的ajax请求方法:

function Loop_ajax(index, array) {  if (index < arraylength) {   var value = array[index];  $get("/home/loop_ajax", { value: value }, function (data) {  consolelog(array[index] + "," + data);  if (index < arraylength) {  Loop_ajax(index + 1, array);   }  });  }  }  

调用:

$(function () {  Loop_ajax(0, array);  });  

测试结果如下:

contentType,默认值: "application/x->

大多数情况不用重新指定,如果遇到乱码的问题,可以考虑添加一下参数,如:application/x->contentType:"application/x->今天闲的无聊,把以前遗留的问题解决一下,比如让人头痛的Jquery乱码问题。其实这方面文章已经很多了,但全面解决各种问题的很少,今天总结一下,方便自己也方便大家。
原因很简单: 其实他的中文乱码就是因为contentType没有指定编码,对于不同Jquery的版本中这个地方有不同的设置,就拿我遇到的,jquery-161和jquery-183就有不同的定义。
解决办法:
在jquery-161文件中,搜索'contentType'
然后在application/x->ajax向服务器发送请求有以下几个步骤:1传值方式:get或者post;2请求地址url即请求数据的地址;3数据传递方式一般是json;4成功返回值data(自定义返回值的变量);

ajax是一种局部刷新后台调用制作网页的技术,而MyEclipse是java开发的工具跟VS平级,与开发ajax八竿子打不着的。如果在2008下,有ajax的功能,建一个aspnet的网页就中,左侧有ajax的控件,如果那些控件不够用的话可以下载ajax tookits。
但是如果是VS2005的话,需要相应配置。。。
VS2005中安装AJAX
1,下载并安装 ASPAJAXExtSetupmsi
下载完 ASPAJAXExtSetupmsi 安装更新后在你的系统盘下的(以C盘为例) 出现这个 文件夹:
C:\Program Files\Microsoft aspNET\ASPNET 20 ajax Extensions\v1061025
安装这个后我们就可以创建Aspnet AJAXEnabledWebSite站点了,这其实就是个ajaxnet网站的模板。但是我们现在还不能使用微软给我们开发好的ajax控件。
2下载AjaxControlToolkit
>

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zz/12683849.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-27
下一篇 2023-05-27

发表评论

登录后才能评论

评论列表(0条)

保存