Jquery中Ajax使用
关于Ajax
ajax 的全称是Asynchronous JavaScript and XML，其中，Asynchronous 是异步的意思，它有别于传统web开发中采用的同步的方式，同步是指：发送方发出数据后，等接收方发回响应以后才发下一个数据包的通讯方式。而异步是指：发送方发出数据后，不等接收方发回响应，接着发送下个数据包的通讯方式 。
ajax的工作原理就是通过XmlHttpRequest对象来向服务器发出异步请求，从服务器中获得数据，然后用Javascript来操作DOM从而更新局部页面。
jquery中的ajax
自从JavaScript库诞生之后，对JavaScript的各种方法进行了封装，包括了ajax，相比于原生ajax而言，在封装后的Ajax的操作更加简洁，功能更加强大。
ajax的基本使用方法为$.ajax()，其中ajax默认是使用了get方法请求，并且默认以异步去请求资源。也可以通过$.get(url, [data], [callback], [type])或者$.post(url, [data], [callback], [type])来改变请求方式。
其中，也可以通过向方法中传入对象，进行资源请求。
1.url
说明：发送请求的地址（默认为当前页面），要求是String类型的参数，比如是.net下，"~wexin(控制器)/getweinxinmenu(动作)"，
2.type
说明：请求方法(post或者get)，默认是get，要求是String类型的参数。其他的htpp请求如（put、delete）等也支持，但是要浏览器支持
3.timeout
说明：设置请求超时时间（毫秒），要求是number类型的参数。此设置将覆盖$.ajaxSetup()方法的全局设置。
4.async
说明：默认值为true，所有请求是异步，要求是Bool类型的参数，如果需要发送同步请求，将此项设置为false。注意：同步时浏览器会被锁住。
5.cache
说明：默认为true(当datatype为script时，默认为false)从浏览器缓存中加载请求信息，要求是Bool类型的参数。
6.data
说明：发送到服务器的数据，要求是Object或string类型的参数。如果已经不是字符串，将自动转换为字符串格式。get请求中将附加在url后。防止这种自动转换，可以查看 processData选项。对象必须为key/value格式，例如{foo1:"bar1",foo2:"bar2"}转换为&foo1=bar1&foo2=bar2。如果是数组，JQuery将自动为不同值对应同一个名称。例如{foo:["bar1","bar2"]}转换为&foo=bar1&foo=bar2。
7.dataType:
说明：预期服务器返回的数据类型，要求为String类型的参数。如果不指定，JQuery将自动根据http包mime信息返回responseXML或responseText，并作为回调函数参数传递。可用的类型如下：
xml：返回XML文档，可用JQuery处理。
html：返回纯文本HTML信息；包含的script标签会在插入DOM时执行。
script：返回纯文本JavaScript代码。不会自动缓存结果。除非设置了cache参数。注意在远程请求时（不在同一个域下），所有post请求都将转为get请求。
json：返回JSON数据。
jsonp：JSONP格式。使用SONP形式调用函数时，例如myurl?callback=?，JQuery将自动替换后一个“?”为正确的函数名，以执行回调函数。
text：返回纯文本字符串。
具体代码
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <script type="text/javascript" src="Public/js/jquery-easyui-1.3.1/jquery-1.8.2.min.js"></script> 5 <script type="text/javascript"> 6 $(function(){ 7 //按钮单击时执行 8 $("#testAjax").click(function(){ 9 10 //Ajax调用处理 11 var html = $.ajax({ 12 type: "POST", 13 url: "xxx", 14 data: "name=garfield&age=18", 15 async: false 16 17 }).responseText; 18 $("#myDiv").html('<h2>'+html+'</h2>'); 19 }); 20 }); 21 </script> 22 </head> 23 <body> 24 <div id="myDiv"><h2>通过 AJAX 改变文本</h2></div> 25 <button id="testAjax" type="button">Ajax改变内容</button> 26 </body> 27 </html>
