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 相关文章推荐
js弹出的对话窗口永远保持居中显示
Dec 15 Javascript
textarea 控制输入字符字节数(示例代码)
Dec 27 Javascript
Javascript中3种实现继承的方法和代码实例
Aug 12 Javascript
简单讲解AngularJS的Routing路由的定义与使用
Mar 05 Javascript
深入探究AngularJs之$scope对象(作用域)
Jul 20 Javascript
ReactNative列表ListView的用法
Aug 02 Javascript
基于JavaScript实现报警器提示音效果
Oct 27 Javascript
vue.js中引入vuex储存接口数据及调用的详细流程
Dec 14 Javascript
浅谈VUE监听窗口变化事件的问题
Feb 24 Javascript
Vue项目中添加锁屏功能实现思路
Jun 29 Javascript
vue3实现v-model原理详解
Oct 09 Javascript
Vue两个版本的区别和使用方法(更深层次了解)
Feb 16 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
实例(Smarty+FCKeditor新闻系统)
2007/01/02 PHP
Zend Framework教程之Zend_Helpers动作助手ViewRenderer用法详解
2016/07/20 PHP
PHP函数用法详解【初始化、嵌套、内置函数等】
2020/06/02 PHP
一页面多XMLHttpRequest对象
2007/01/22 Javascript
jQuery使用toggleClass方法动态添加删除Class样式的方法
2015/03/26 Javascript
JavaScript驾驭网页-获取网页元素
2016/03/24 Javascript
JavaScript事件代理和委托详解
2016/04/08 Javascript
Javascript中apply、call、bind的巧妙使用
2016/08/18 Javascript
jquery-mobile表单的创建方法详解
2016/11/23 Javascript
基于bootstrap的文件上传控件bootstrap fileinput
2016/12/23 Javascript
jQuery日程管理插件fullcalendar使用详解
2017/01/07 Javascript
node.js的事件机制
2017/02/08 Javascript
令按钮悬浮在(手机)页面底部的实现方法
2017/05/02 Javascript
基于vue 实现token验证的实例代码
2017/12/14 Javascript
vue+webpack实现异步组件加载的方法
2018/02/03 Javascript
解决修复npm安装全局模块权限的问题
2018/05/17 Javascript
js根据json数据中的某一个属性来给数据分组的方法
2018/10/08 Javascript
微信小程序学习笔记之表单提交与PHP后台数据交互处理图文详解
2019/03/28 Javascript
bootstrap Table实现合并相同行
2019/07/19 Javascript
vue把输入框的内容添加到页面的实例讲解
2019/11/11 Javascript
VUE 实现动态给对象增加属性,并触发视图更新操作示例
2019/11/29 Javascript
JavaScript通如何过RGraph实现动态仪表盘
2020/10/15 Javascript
js 图片懒加载的实现
2020/10/21 Javascript
[37:02]OG vs INfamous 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/17 DOTA
Python中的True,False条件判断实例分析
2015/01/12 Python
Python随机函数random()使用方法小结
2018/04/29 Python
python pcm音频添加头转成Wav格式文件的方法
2019/01/09 Python
基于Numpy.convolve使用Python实现滑动平均滤波的思路详解
2019/05/16 Python
python中怎么表示空值
2020/06/19 Python
杭州联环马网络笔试题面试题
2013/08/04 面试题
汽车技术服务与营销专业在籍生自荐信
2013/09/28 职场文书
安全隐患整改报告
2014/11/06 职场文书
2014年教育教学工作总结
2014/11/13 职场文书
如何用PHP实现分布算法之一致性哈希算法
2021/05/26 PHP
使用tensorflow 实现反向传播求导
2021/05/26 Python
Redis高并发防止秒杀超卖实战源码解决方案
2021/11/01 Redis