JQuery AJAX【随手记】

JQuery AJAX

jQuery提供AJAX有关的方法，通过JQuery AJAX方法可以使用get、post从远程服务器上请求文本，HTML、XML 或 JSON - 同时您能够把这些外部数据直接载入网页的被选元素中。

单纯的AJAX需要编写额外的代码对浏览器进行测试，但是使用jQuery AJAX只需要一行简单的代码就可以实现AJAX代码。

jQuery ajax - ajax()方法

该方法通过HTTP请求加载远程数据，是jQuery底层AJAX实现，$.ajax()返回创建的XMLHttpRequeat对象，绝大多数情况无需操作，同时在最简单的情况下可以不带任何参数直接使用。

注意：所有的选项都可以通过$.ajaxSetup（）函数来全局设置。

语法：jQuery.ajax([参数])

参数：可见链接：https://www.w3school.com.cn/jquery/ajax_ajax.asp

回调函数：

若要处理$.ajax()得到的数据，则需要回调函数：

数据类型：

$.ajax() 函数依赖服务器提供的信息来处理返回的数据。如果服务器报告说返回的数据是 XML，那么返回的结果就可以用普通的 XML 方法或者 jQuery 的选择器来遍历。如果见得到其他类型，比如 HTML，则数据就以文本形式来对待。

通过 dataType 选项还可以指定其他不同数据处理方式。除了单纯的 XML，还可以指定 html、json、jsonp、script 或者 text。

其中，text 和 xml 类型返回的数据不会经过处理。数据仅仅简单的将 XMLHttpRequest 的 responseText 或 responseHTML 属性传递给 success 回调函数。

（其他注意事项仍见上方链接）

发送数据到服务器：

默认使用get，若要使用post可以设定type参数值，方法的选择会影响data选项中的内容如何发送到服务器中。

data 选项既可以包含一个查询字符串，比如 key1=value1&key2=value2 ，也可以是一个映射，比如 {key1: 'value1', key2: 'value2'} 。如果使用了后者的形式，则数据再发送器会被转换成查询字符串。这个处理过程也可以通过设置 processData 选项为 false 来回避。如果我们希望发送一个 XML 对象给服务器时，这种处理可能并不合适。并且在这种情况下，我们也应当改变 contentType 选项的值，用其他合适的 MIME 类型来取代默认的 application/x-www-form-urlencoded 。

 jQuery AJAX  load()方法【jQuery加载】

load（）方法从服务器加载数据，并把返回的数据放入被选元素中

语法：$(selector).load(URL,data,callback);

• 必需的 URL 参数规定您希望加载的 URL。
• 可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。
• 可选的 callback 参数是 load() 方法完成后所执行的函数名称。

样例：

把文件demo_test.txt的内容加载到指定的<div>元素中：

方法一：$("#div1").load("demo_test.txt");

方法二：把JQuery选择器添加到URL参数，例如把demo_test.txt文件中id="p1"的元素的内容加载到指定的<div>元素中：$("#div1").load("demo_test.txt #p1");

 jQuery AJAX get()和post()方法

用于通过http get或post请求从服务器请求数据。

jQuery $.get()方法

语法：$.get(URL,callback);

• 必需的 URL 参数规定您希望请求的 URL。
• 可选的 callback 参数是请求成功后所执行的函数名称。

样例：

 第一个参数是希望请求的URL（“demo_test.asp”），第二个是回调函数，第一个回调参数有被请求的内容，第二个回调参数存有请求状态。

该asp文档格式为：

 jQuery $.post()方法

语法：$.post(URL,data,callback);

• 必须的URL参数规定希望请求的URL
• 可选的callback参数是请求成功后被执行的函数名
• 可选的data参数规定连同请求发送的数据

样例：

第一个参数URL连同请求（name和city）一起发送数据，然后ASP脚本读取参数，进行处理然后返回结果，第三个参数即回调函数。

该ASP文件类似于：