jquery的ajax异步请求接收返回json数据实例


Posted in Javascript onJune 16, 2014

jquery的ajax异步请求接收返回json数据方法设置简单,一个是服务器处理程序是返回json数据,另一种就是ajax发送设置的datatype设置为jsonp格式数据或json格式都可以。

代码示例如下:

$('#send').click(function () {

    $.ajax({

        type : "GET",

        url : "a.php",

        dataType : "jsonp",

        success : function (data) {

            $.each(data.items, function (i, item) {

                $("<img class='para'/> ").attr("src", item.media.m).appendTo("#resText");

                if (i == 3) {

                    return false;

                }

            });

        }

    });

});

$.ajax方法如下:

$.ajax({ 

   type: "POST",

   url:  ctxRoot+'FolderAction!saveInformSetting.action',

   data: 'jsonStr=' + inform_settingListStr,

   dataType: "json",

   complete: function(data){

       //在这里做些事情,假设返回的json数据里有name这个属性

       //有时候可以直接data.name或者data['name']去访问

       //但有时候,却要通过var jsonData = eval("("+data.responseText+")");才可以通过jsonData.name访问,而且这种情况下,需要是complete而不是success

   }

   });

$.ajax(options)

这是最根本的JQuery Ajax方法,只有一个参数options,该options参数中包含了请求信息和回调函数的信息。参数内容都是key:value对形式出现,并且都是可选的。

语法如下:

$.ajax({options});
url:(string)发送请求的地址,可以是服务器页面也可以是WebService动作。
type:(string)请求方式,POST或GET
data:(object)向服务器发送请求时带去的数据。是key:value对形式,如:{name:"grayworm",sex:"male"},如果是数组{works:["work1","work2"]}
dataType:(string)预期返回的数据类型。xml,html,json,text等
beforeSend:(Function)发送ajax请求前被触发,如果返回false则取消本次请求。如果异步请求需要显示gif动画,那应当在这里设置相应<img>的可见。

Javascript 相关文章推荐
XHTML-Strict 内允许出现的标签
Dec 11 Javascript
jQuery 位置函数offset,innerWidth,innerHeight,outerWidth,outerHeight,scrollTop,scrollLeft
Mar 23 Javascript
jquery.validate使用攻略 第二部
Jul 01 Javascript
jQuery的实现原理的模拟代码 -1 核心部分
Aug 01 Javascript
jquery $.getJSON()跨域请求
Dec 21 Javascript
js和jquery中循环的退出和继续学习记录
Sep 06 Javascript
jQuery遍历对象、数组、集合实例
Nov 08 Javascript
jQuery实现跨域iframe接口方法调用
Mar 14 Javascript
js弹出对话框方式小结
Nov 17 Javascript
JS实现json的序列化和反序列化功能示例
Jun 13 Javascript
vue使用vue-i18n实现国际化的实现代码
Apr 08 Javascript
教你使用vue-cli快速构建的小说阅读器
May 13 Javascript
Javascript判断图片尺寸大小实例分析
Jun 16 #Javascript
javascript进行数组追加方法小结
Jun 16 #Javascript
使用JavaScript实现网页版Pongo设计思路及源代码分享
Jun 16 #Javascript
jQuery切换网页皮肤并保存到Cookie示例代码
Jun 16 #Javascript
js限制文本框只能输入数字方法小结
Jun 16 #Javascript
JS实现简单的顶部定时关闭层效果
Jun 15 #Javascript
jQuery中的height innerHeight outerHeight区别示例介绍
Jun 15 #Javascript
You might like
提高PHP编程效率 引入缓存机制提升性能
2010/02/15 PHP
PHP 返回13位时间戳的实现代码
2016/05/13 PHP
PHP基于curl后台远程登录正方教务系统的方法
2016/10/14 PHP
PHP观察者模式示例【Laravel框架中有用到】
2018/06/15 PHP
扩展easyui.datagrid,添加数据loading遮罩效果代码
2010/11/02 Javascript
js中top/parent/frame概述及案例应用
2013/02/06 Javascript
javascript中的parseInt和parseFloat区别
2013/07/12 Javascript
javascript实现数独解法
2015/03/14 Javascript
javascript关于运动的各种问题经典总结
2015/04/27 Javascript
Web前端新人笔记之jquery入门心得(新手必看)
2016/05/17 Javascript
javascript基本语法
2016/05/31 Javascript
AngularJs 指令详解及示例代码
2016/09/01 Javascript
Node.js实现文件上传的示例
2017/06/28 Javascript
vue弹窗消息组件的使用方法
2020/09/24 Javascript
vue如何进行动画的封装
2018/09/26 Javascript
Jquery和CSS实现选择框重置按钮功能
2018/11/08 jQuery
如何利用ES6进行Promise封装总结
2019/02/11 Javascript
在VUE style中使用data中的变量的方法
2020/06/19 Javascript
[02:07]DOTA2超级联赛专访BBC:难忘网吧超神经历
2013/06/09 DOTA
Python实现生成简单的Makefile文件代码示例
2015/03/10 Python
探索Python3.4中新引入的asyncio模块
2015/04/08 Python
微信跳一跳python辅助软件思路及图像识别源码解析
2018/01/04 Python
py-charm延长试用期限实例
2019/12/22 Python
python中not、and和or的优先级与详细用法介绍
2020/11/03 Python
python3爬虫中多线程进行解锁操作实例
2020/11/25 Python
HTML5制作酷炫音频播放器插件图文教程
2014/12/30 HTML / CSS
单身旅行者的单身假期:Just You
2018/04/08 全球购物
日本最大的购物网站:日本乐天市场(Rakuten Ichiba)
2020/11/04 全球购物
本科毕业生的求职信范文
2013/11/20 职场文书
音乐教育感言
2014/03/05 职场文书
文化宣传方案
2014/03/13 职场文书
领导干部贪图享乐整改措施
2014/09/21 职场文书
自我推荐信怎么写
2015/03/24 职场文书
毕业生爱心捐书倡议书
2015/04/27 职场文书
2015年乡镇残联工作总结
2015/05/13 职场文书
解决redis sentinel 频繁主备切换的问题
2021/04/12 Redis