jQuery中$.get、$.post、$.getJSON和$.ajax的用法详解


Posted in Javascript onNovember 19, 2014

当我们用javascript写ajax程序写得很“开心”的时候,突然有人告诉你有一种东西叫jquery,它会告诉你不直接和HttpRequest是多么的快乐,同时你再也不需要再烦恼纠结的ajax乱码问题,更幸福的是你的js代码将大大地简化,看完本文,你会发现,ajax,简单的来讲就是一句话的事情。

1、$.get

$.get()方法使用GET方式来进行异步请求,它的语法结构为:

$.get( url [, data] [, callback] )

解释一下这个函数的各个参数:

url:string类型,ajax请求的地址。

data:可选参数,object类型,发送至服务器的key/value数据会作为QueryString附加到请求URL中。

callback:可选参数,function类型,当ajax返回成功时自动调用该函数。

最后写一个$.get()的实例供大家参考:

$.get(

    "submit.aspx",{

        id:     '123',

        name:   '青藤园',

    },function(data,state){

        //这里显示从服务器返回的数据

        alert(data);

        //这里显示返回的状态

        alert(state);

    }

)

2、$.post()

$.post()方法使用POST方式来进行异步请求,它的语法结构为:

$.post(url,[data],[callback],[type])

这个方法和$.get()用法差不多,唯独多了一个type参数,那么这里就只介绍type参数吧,其他的参考上面$.get()的。

type:type为请求的数据类型,可以是html,xml,json等类型,如果我们设置这个参数为:json,那么返回的格式则是json格式的,如果没有设置,就和$.get()返回的格式一样,都是字符串的。

最后写一个$.post()的实例供大家参考:

$.post(

    "submit.aspx",{

        id:     '123',

        name:   '青藤园',

    },function(data,state){

        //这里显示从服务器返回的数据

        alert(data);

        //这里显示返回的状态

        alert(state);

    },

    "json"

)

3、$.getJSON()

$.getJSON()是专门为ajax获取json数据而设置的,并且支持跨域调用,其语法的格式为:

getJSON(url,[data],[callback])

url:string类型, 发送请求地址  data :可选参数, 待发送 Key/value 参数 ,同get,post类型的data callback :可选参数,载入成功时回调函数,同get,post类型的callback

JSON是一种理想的数据传输格式,它能够很好的融合与JavaScript或其他宿主语言,并且可以被JS直接使用。使用JSON相比传统的通过 GET、POST直接发送“裸体”数据,在结构上更为合理,也更为安全。至于jQuery的getJSON()函数,只是设置了JSON参数的 ajax()函数的一个简化版本。这个函数也是可以跨域使用的,相比get()、post()有一定优势。另外这个函数可以通过把请求url写 成"myurl?callback=X"这种格式,让程序执行回调函数X。

4、$.ajax()

$.ajax()是jquery中通用的一个ajax封装,其语法的格式为:

$.ajax(options)

其中options是一个object类型,它指明了本次ajax调用的具体参数,这里我把最常用的几个参数附上

$.ajax({

        url: 'submit.aspx',

        datatype: "json",

        type: 'post',

        success: function (e) {   //成功后回调

            alert(e); 

        },

        error: function(e){    //失败后回调

            alert(e);

        },

        beforeSend: function(){  /发送请求前调用,可以放一些"正在加载"之类额话

            alert("正在加载");

        }

})

以上就是jquery实现ajax调用的几种方法,ajax调用还是挺复杂的,希望本文能对大家有所帮助,如有什么疑问,也可以联系我,大家共同进步。

Javascript 相关文章推荐
javascript中直接写php代码的方法
Jul 31 Javascript
js 数值转换为3位逗号分隔的示例代码
Feb 19 Javascript
60个很实用的jQuery代码开发技巧收集
Dec 15 Javascript
jQuery中:animated选择器用法实例
Dec 29 Javascript
javascript实现数组内值索引随机化及创建随机数组的方法
Aug 10 Javascript
JavaScript蒙板(model)功能的简单实现代码
Aug 04 Javascript
jQuery实现选项卡功能(两种方法)
Mar 08 Javascript
Vue学习之路之登录注册实例代码
Jul 06 Javascript
JQuery和html+css实现带小圆点和左右按钮的轮播图实例
Jul 22 jQuery
基于vue.js快速搭建图书管理平台
Oct 29 Javascript
深入理解vue中的slot与slot-scope
Apr 22 Javascript
js代码实现轮播图
May 04 Javascript
实现图片预加载的三大方法及优缺点分析
Nov 19 #Javascript
jQuery Ajax()方法使用指南
Nov 19 #Javascript
javascript匿名函数实例分析
Nov 18 #Javascript
Linux下使用jq友好的打印JSON技巧分享
Nov 18 #Javascript
删除Javascript Object中间的key
Nov 18 #Javascript
如何在MVC应用程序中使用Jquery
Nov 17 #Javascript
Jquery实现仿腾讯微博发表广播
Nov 17 #Javascript
You might like
php笔记之:文章中图片处理的使用
2013/04/26 PHP
使用迭代器 遍历文件信息的详解
2013/06/08 PHP
ThinkPHP验证码使用简明教程
2014/03/05 PHP
简单实用的网站PHP缓存类实例
2014/07/18 PHP
初识php MVC
2014/09/10 PHP
php利用header函数下载各种文件
2016/08/24 PHP
支持汉转拼和拼音分词的PHP中文工具类ChineseUtil
2018/02/23 PHP
Div自动滚动到末尾的代码
2008/10/26 Javascript
JavaScript中valueOf函数与toString方法深入理解
2012/12/02 Javascript
javascript 用函数语句和表达式定义函数的区别详解
2014/01/06 Javascript
javascript中的循环语句for语句深入理解
2014/04/04 Javascript
JavaScript中匿名函数用法实例
2015/03/23 Javascript
js变形金刚文字特效代码分享
2015/08/20 Javascript
JS+CSS实现精美的二级导航效果代码
2015/09/17 Javascript
详解JavaScript中localStorage使用要点
2016/01/13 Javascript
js实现目录链接,内容跟着目录滚动显示的简单实例
2016/10/15 Javascript
Bootstrap 网站实例之单页营销网站
2016/10/20 Javascript
Bootstrap超大屏幕的实现代码
2017/03/22 Javascript
微信分享调用jssdk实例
2017/06/08 Javascript
vue.js框架实现表单排序和分页效果
2017/08/09 Javascript
详解vue 模拟后台数据(加载本地json文件)调试
2017/08/25 Javascript
JS/HTML5游戏常用算法之碰撞检测 包围盒检测算法详解【矩形情况】
2018/12/13 Javascript
element el-tree组件的动态加载、新增、更新节点的实现
2020/02/27 Javascript
[03:55]DOTA2完美大师赛选手传记——LFY.MONET
2017/11/18 DOTA
Python写的服务监控程序实例
2015/01/31 Python
python中对_init_的理解及实例解析
2019/10/11 Python
pandas 像SQL一样使用WHERE IN查询条件说明
2020/06/05 Python
python实现自动打卡的示例代码
2020/10/10 Python
Vrbo西班牙:预订您的度假公寓(公寓、乡村房屋…)
2020/04/27 全球购物
函授毕业生自我鉴定
2013/11/06 职场文书
旅行社各个岗位职责
2014/03/15 职场文书
大学社团计划书
2014/05/01 职场文书
2015年乡镇科普工作总结
2015/05/13 职场文书
Nginx域名转发https访问的实现
2021/03/31 Servers
MySQL深度分页(千万级数据量如何快速分页)
2021/07/25 MySQL
nginx实现动静分离的方法示例
2021/11/07 Servers