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的onchange事件与jQuery的change()方法比较
Sep 28 Javascript
jquery实现通用版鼠标经过淡入淡出效果
Jun 15 Javascript
Javascript获取当前日期的农历日期代码
Oct 08 Javascript
javascript实现捕捉键盘上按下的键
May 05 Javascript
jquery实现触发时更新下拉列表内容的方法
Dec 02 Javascript
javascript的理解及经典案例分析
May 20 Javascript
AngularJS bootstrap启动详解及实例代码
Sep 14 Javascript
超全面的JavaScript开发规范(推荐)
Jan 21 Javascript
微信小程序 跳转传参数与传对象详解及实例代码
Mar 14 Javascript
es6的数字处理的方法(5个)
Mar 16 Javascript
web前端vue实现插值文本和输出原始html
Jan 19 Javascript
快速解决element的autofocus失效问题
Sep 08 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
怎么使 Mysql 数据同步
2006/10/09 PHP
PHP 中英文混合排版中处理字符串常用的函数
2007/04/12 PHP
PHP中使用smarty生成静态文件的例子
2014/04/24 PHP
php数组去除空值函数分享
2015/02/02 PHP
PHP判断是否是微信打开还是浏览器打开的方法
2019/02/27 PHP
php命名空间设计思想、用法与缺点分析
2019/07/17 PHP
浅谈javascript的原型继承
2012/07/25 Javascript
通过length属性判断jquery对象是否存在
2013/10/18 Javascript
jquery插件jSignature实现手动签名
2015/05/04 Javascript
jquery实现简单手风琴菜单效果实例
2015/06/13 Javascript
JS简单判断字符在另一个字符串中出现次数的2种常用方法
2017/04/20 Javascript
详解AngularJs ui-router 路由的简单介绍
2017/04/26 Javascript
使用JS代码实现俄罗斯方块游戏
2018/08/03 Javascript
webpack项目使用eslint建立代码规范实现
2019/05/16 Javascript
使用pkg打包ThinkJS项目的方法步骤
2019/12/30 Javascript
JS Web Flex弹性盒子模型代码实例
2020/03/10 Javascript
详解Vue3 Teleport 的实践及原理
2020/12/02 Vue.js
Android应用开发中Action bar编写的入门教程
2016/02/26 Python
Django ManyToManyField 跨越中间表查询的方法
2018/12/18 Python
对python修改xml文件的节点值方法详解
2018/12/24 Python
python绘制汉诺塔
2021/03/01 Python
html5的canvas实现3d雪花飘舞效果
2013/12/27 HTML / CSS
意大利灯具购物网站:Lampade.it
2018/10/18 全球购物
Marc O’Polo俄罗斯官方在线商店:德国高端时尚品牌
2019/12/26 全球购物
七年级数学教学反思
2014/01/22 职场文书
优秀学生获奖感言
2014/02/15 职场文书
幼儿园小班评语大全
2014/04/17 职场文书
2014年业务工作总结
2014/11/17 职场文书
2014年质量工作总结
2014/11/22 职场文书
2014年中职班主任工作总结
2014/12/16 职场文书
总经理检讨书范文
2015/02/16 职场文书
股东大会通知
2015/04/24 职场文书
幼儿园六一主持词
2015/06/30 职场文书
担保书怎么写 ?
2019/04/22 职场文书
《时代广场的蟋蟀》读后感:真挚友情,温暖世界!
2020/01/08 职场文书
漫画「日和酱的要求是绝对的」第3卷封面公开
2022/03/21 日漫