描述一次完整的Ajax请求过程

描述一次完整的Ajax请求过程,第1张

AJAX运行过程中5种状态:

0 - (未初始化)还没有调用send()方法,

1 - (载入)已调用send()方法,正在发送请求,

2 - (载入完成)send()方法执行完成,

3 - (交互)正在解析响应内容,

4 - (完成)响应内容解析完成,可以在客户端调用了。

$.post(url,params,function(data){},"json")

Jquery发送的post请求  

参数1:请求路径                                        一般在页面中,发送数据到controller层

参数2:发送过去的参数                             获取到页面中的一些参数

参数3:回调函数                                        请求成功,在controller层中对应的处理方法上面返回的数据

参数4:请求和返回的数据类型         可以是json

这个是jquery包装的post请求,原始的ajax请求比较麻烦,我一般用的都是jquery封装的ajax请求

这个方法,一定要注意最后的一个参数

<script type="text/javascript">

/*点击修改按钮,让市场价格,售价,库存,购买显示亮起来,可以输入数字  */

function updateSku(skuId) {

$("#m" + skuId).attr("disabled", false)

$("#p" + skuId).attr("disabled", false)

$("#i" + skuId).attr("disabled", false)

$("#l" + skuId).attr("disabled", false)

/*获取修改后的,sku中的数据  */

function addSku(skuId)

var m = $("#m" + skuId).attr("disabled", true).val()

var p = $("#p" + skuId).attr("disabled", true).val()

var i = $("#i" + skuId).attr("disabled", true).val()

var l = $("#l" + skuId).attr("disabled", true).val()

//保存

var url = "/product/updateSku.do"

var params = {"marketPrice" : m,"skuPrice" : p,"stockInventory" : i,"skuUpperLimit" :

l,"id" : skuId }

$.post(url,params,function(data){

alert(data.message)

<td align="center">

<input type="text" id="m${sku.id}" name="marketPrice" value="${sku.marketPrice}"

disabled="disabled" size="10" />

// 库存中的保存 @RequestMapping("/product/updateSku.do") public void

updateSku(Sku sku, Model model, HttpServletResponse response) { // 修改

skuService.updateSkuByKey(sku) JSONObject jo = new JSONObject()

jo.put("message", "保存成功!") // 将ajax请求,返回一个成功的信息

ResponseUtils.sendJson(response, jo.toString()) }

这个是我自己在学习的时候的笔记,给你看看。或许能理解。。。 AJAX是异步交互,在客户端与服务器只加引入一个媒介,从改变了同步交互过程中“处理--等待--处理--等待”的模式。

浏览器在执行任务时即装载了Ajax引擎。该引擎室js编写的,通常位于页面的框架中,负责转发客户端和服务器之间的交互。另外,

通过js调用AJAX引擎,可以使得页面不在被整体刷新,而仅仅更新用户需要的部分,不但避免了“白屏”现象,还大大节省了带快,加快了

web浏览的速度。

好处可以归纳为几点:

1.减轻服务器的负担,加快浏览速度。

2.带来更好的用户体验。

3.基于标准化并被广泛支持的技术,不需要下载插件或小程序。目前主流的浏览器都支持AJAX技术,使得它的推广十分顺畅。

4.进一步促进页面呈现书数据分离。AJAX获取服务器可以完全利用单独的模块进行 *** 作,从而使得技术人员和美工人员能够更好的分工与配合。

AJAX的组成部分:是由4中技术组成的。

JAVAScript:是通用的脚本语言,用来嵌入在某种应用之中。AJAX应用程序是用JAVASCRIPT编写的。

CSS:CSS为WEB页面元素提供了可视化样式的定义方法。AJAX应用中,用户界面的样式可以通过CSS独立修改。

DOM:通过JS修改DOM,AJAX应用程序可以再运行时改变用户界面,或者局部更新页面中的某个节点

XMLHttpRequest:XMLHttpRequest对象允许Web程序员从WEB服务器以后台的方式获取数据。数据的格式通常是XML,或者是文本。

什么叫异步交互: 异步交互可以使页面同事处理多件事物,而传统的同步交互必须一件一件事情按顺序完成。

不太严谨的说,异步交互就是一个简单的多线程,它能够使用户同事进行多项 *** 作而不间断。AJAX的的异步交互在后台默默地工作着,呈现给用户一个无刷新的页面。


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

原文地址: http://outofmemory.cn/yw/11454080.html

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

发表评论

登录后才能评论

评论列表(0条)

保存