天天看点

jQuery用于请求服务器的函数

jQuery为我们包装简化了常用的请求方法,其中有一个post方法,此方法可以通过 HTTP POST 请求从服务器载入数据。

语法:

jQuery.post(url,data,success(data, textStatus, jqXHR),dataType);
jQuery用于请求服务器的函数

该方法实际上是简写的 Ajax 方法,等价于:

以下使用一个简单的示例演示一下post方法的使用:

服务端代码:

客户端代码:

html代码:

js代码:

运行结果:

jQuery用于请求服务器的函数
jQuery用于请求服务器的函数

虽然以上实验已经可以成功的请求服务器并且载入了服务器返回的数据,但是将表单信息转换成json格式的那一段代码还是复杂了一些,每个表单组件的数据都得单独的去获得,如果表单中有十来个组件的话,岂不得写十来句代码去逐个获得。所以这时候就得用到一个可以将表单数据序列化成json格式的神器:jquery.serializeJSON,这是一个基于jQuery的开源插件,以下是该插件的下载地址:

<a href="http://www.bootcdn.cn/jquery.serializeJSON/">http://www.bootcdn.cn/jquery.serializeJSON/</a>

使用该插件后,一句代码就可以解决表单数据序列化成json格式的问题,修改后的代码:

服务端代码依旧不变,运行结果:

jQuery用于请求服务器的函数
jQuery用于请求服务器的函数

get和post在使用上基本上是一样的,这是一个简单的 GET 请求功能以取代复杂 \$.ajax 。请求成功时可调用回调函数。如果想要在出错时执行函数,则需要使用 $.ajax。

$(selector).get(url,data,success(response,status,xhr),dataType)
jQuery用于请求服务器的函数

同样的该函数也是简写的 Ajax 函数,等价于:

示例:

服务端代码只需要把doPost改为doGet即可。

jQuery用于请求服务器的函数
jQuery用于请求服务器的函数

思维导图:

jQuery用于请求服务器的函数

ajax方法是 jQuery 底层的 AJAX 实现,而以上介绍的get和post方法则是ajax方法的简写,ajax方法会返回其创建的 XMLHttpRequest 对象。大多数情况下你无需直接操作该函数,除非你需要操作不常用的选项,以获得更多的灵活性。

最简单的情况下,ajax() 可以不带任何参数直接使用。

提示:所有的选项都可以通过 $.ajaxSetup() 函数来进行全局设置。

jQuery.ajax({settings...})
jQuery用于请求服务器的函数

下面的表格中列出了可能的键/值:

jQuery用于请求服务器的函数

示例,服务端代码不变:

jQuery用于请求服务器的函数
jQuery用于请求服务器的函数

本文转自 ZeroOne01 51CTO博客,原文链接:http://blog.51cto.com/zero01/2058342,如需转载请自行联系原作者

继续阅读