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 相关文章推荐
一些不错的js函数ajax
Aug 20 Javascript
jquery选择器大全 全面详解jquery选择器
Mar 06 Javascript
js插件YprogressBar实现漂亮的进度条效果
Apr 20 Javascript
初识Javascript小结
Jul 16 Javascript
jquery仿百度百科底部浮动导航特效
Aug 08 Javascript
JavaScript常用标签和方法总结
Sep 01 Javascript
js阻止浏览器默认行为的简单实例
May 15 Javascript
Jquery树插件zTree实现菜单树
Jan 24 Javascript
JS异步文件上传(兼容IE8+)
Apr 02 Javascript
使用p5.js实现动态GIF图片临摹重现
Oct 23 Javascript
微信小程序 wx.getUserInfo引导用户授权问题实例分析
Mar 09 Javascript
js中forEach,for in,for of循环的用法示例小结
Mar 14 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中的reflection反射机制测试例子
2014/08/05 PHP
thinkPHP框架中layer.js的封装与使用方法示例
2019/01/18 PHP
几个javascript操作word的参考代码
2009/10/26 Javascript
jQuery学习4 浏览器的事件模型
2010/02/07 Javascript
jquery自定义下拉列表示例
2014/04/25 Javascript
jquery.hotkeys监听键盘按下事件keydown插件
2014/05/11 Javascript
基于jQuery实现以手风琴方式展开和折叠导航菜单
2016/01/28 Javascript
使用base64对图片的二进制进行编码并用ajax进行显示
2017/01/03 Javascript
微信小程序 列表的上拉加载和下拉刷新的实现
2017/04/01 Javascript
js操作二进制数据方法
2018/03/03 Javascript
JQuery元素快速查找与操作
2018/04/22 jQuery
vue3.0 CLI - 2.5 - 了解组件的三维
2018/09/14 Javascript
详解Python中break语句的用法
2015/05/14 Python
python中os模块详解
2016/10/14 Python
Python matplotlib 画图窗口显示到gui或者控制台的实例
2018/05/24 Python
django一对多模型以及如何在前端实现详解
2019/07/24 Python
对pytorch中的梯度更新方法详解
2019/08/20 Python
python中的逆序遍历实例
2019/12/25 Python
Python任务调度模块APScheduler使用
2020/04/15 Python
Python类class参数self原理解析
2020/11/19 Python
python与idea的集成的实现
2020/11/20 Python
详解win10下pytorch-gpu安装以及CUDA详细安装过程
2021/01/28 Python
网页中的电话号码如何实现一键直呼效果_附示例
2016/03/15 HTML / CSS
HTML5单选框、复选框、下拉菜单、文本域的实现代码
2020/12/01 HTML / CSS
日本快乐生活方式购物网站:Shop Japan
2018/07/17 全球购物
Lacoste澳大利亚官网:服装、鞋类及配饰
2018/11/14 全球购物
P D PAOLA意大利官网:西班牙著名的珠宝首饰品牌
2019/09/24 全球购物
Loreto Gallo英国:欧洲领先的在线药房
2021/01/21 全球购物
将一个文本文件的内容按倒序打印出来
2015/01/05 面试题
电工工作职责范本
2014/02/22 职场文书
yy生日主持词
2014/03/20 职场文书
乡镇爱国卫生月活动总结
2014/06/25 职场文书
爱国主义教育主题班会
2015/08/13 职场文书
运动会广播稿100字
2015/08/19 职场文书
2016保送生自荐信范文
2016/01/29 职场文书
用golang如何替换某个文件中的字符串
2021/04/25 Golang