ajax

一 Ajax究竟是什么? 

Ajax让web开发者创建交互式的网站，功能比缓慢的、静态的网站更像桌面应用。 Gmail 和 Google Maps 是两种最常见的Ajax应用范例。多种方法让Ajax可以在浏览器中直接放置交互，取代浏览器不得不频繁联系web服务器获取信息的状况。 

当访问一个Ajax站点，浏览器象通常那样装载HTML页面。然后，Ajax使用 JavaScript 进行交互。当一个站点访问者请求更多的信息时－－例如，装载一个地图－－JavaScript产生请求。 JavaScript不是向web站点发送一个请求，而是使用API调用XMLHttpRequest 把数据从后台转到前台。(被请求的数据通常是 XML 格式，尽管不是必须的）这使得当 XMLHttpRequest 处理和服务器的通讯时，网页和JavaScript能够继续和用户进行交互。 

JavaScript通过XMLHttpRequest处理信息，然后使用或显示它。但仅仅需要这些数据的部分页面被刷新。这提高了信息的显示速度，因为不必改变整个页面。 

 

二 ajax操作步骤：

        1.利用javascript创建ajax引擎，即XMLHttpRequest对象

        2.在XMLHttpRequest中设置要发送的请求，利用的是open（first,second,third）方法 xmlHttp.open()

                第一个参数代表：该次请求提交的方式：get/post

                第二个参数代表：该次请求的路径url，如果是get，则需要在路径后加上传递的相应参数parama，该url为servlet对应的url

                第三个参数代表：代表的是该次请求的模式，同步模式/异步模式（true）,通常采用异步提交模式

        3.发送请求，调用send方法

        4.需要处理返回值，就要监听readyState，处理每次状态的改变，当状态为4时，将返回值进行真正处理

 

 三  ajax的步骤

           通过事件触发javascript的函数

                   1.创建出ajax的引擎对象XMLHttpRequest对象

                   2.利用该对象设置要发送的请求及其参数(请求是jsp或者是servlet对应的url-pattern)

                   3.利用该对象进行发送请求给服务器

                   4.最后获取到服务器返回的结果 然后对其结果进行dom的操作 将其显示的页面中的某个部分 实现了局部刷新

 

四   ajax提交方式post与get方式的区别

           1.设置请求时不同 即open()方法不一样

                      a).提交方式不同 即第一个参数不同

                      b).请求的url即第二个参数也不同  如果是get提交方式的话  url中包含要提交的参数列表  如果是post则不包含

           2.在发送之前post应该加上一句话 xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

           3.在send()方法中发送要传递给服务器的参数列表

       注意：ajax  get和post提交中文参数时 不同   注意 ajax get提交方式 传递中文参数的问题

 

 这是我学习ajax后做pos机时应用它来显示购物车的商品数量。

 

function get_cart_list(id){
    $.ajax({
        type:"get",
        url:"/get_cart_list",
        data:{"id":id},
        success: function(data){
            var number = 0;
            for(var i in data ){
                var item=data[i];
                number = number + item.count;
            }
            $('#number').html('('+numer+')')
        }
    })
}