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 04 Javascript
lyhucSelect基于Jquery的Select数据联动插件
Mar 29 Javascript
javascript 基础篇3 类,回调函数,内置对象,事件处理
Mar 14 Javascript
Javascript获取当前日期的农历日期代码
Oct 08 Javascript
JavaScript Window浏览器对象模型方法与属性汇总
Apr 20 Javascript
Vuejs第八篇之Vuejs组件的定义实例解析
Sep 05 Javascript
vue-cli项目中使用Mockjs详解
May 14 Javascript
vue如何解决循环引用组件报错的问题
Sep 22 Javascript
JavaScript高阶教程之“==”隐藏下的类型转换
Apr 11 Javascript
JavaScript数值类型知识汇总
Nov 17 Javascript
原生JS实现相邻月份日历
Oct 13 Javascript
js 实现Material UI点击涟漪效果示例
Sep 23 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边学边教》(02.Apache+PHP环境配置――下篇)
2006/12/13 PHP
生成ubuntu自动切换壁纸xml文件的php代码
2010/07/17 PHP
PHP通过header实现文本文件下载的代码
2010/08/08 PHP
微信支付开发告警通知实例
2016/07/12 PHP
php封装db类连接sqlite3数据库的方法实例
2017/12/19 PHP
Laravel统计一段时间间隔的数据方法
2019/10/09 PHP
javascript eval和JSON之间的联系
2009/12/31 Javascript
THREE.JS入门教程(1)THREE.JS使用前了解
2013/01/24 Javascript
javascript中var的重要性分析
2015/02/11 Javascript
JavaScript中的函数声明和函数表达式区别浅析
2015/03/27 Javascript
JavaScript DOM操作表格及样式
2015/04/13 Javascript
JavaScript实现鼠标滑过处生成气泡的方法
2015/05/16 Javascript
javascript实现倒计时并弹窗提示特效
2015/06/05 Javascript
Zabbix添加Node.js监控的方法
2016/10/20 Javascript
移动端手指放大缩小插件与js源码
2017/05/22 Javascript
微信小程序下拉刷新界面的实现
2017/09/28 Javascript
Vue实现双向绑定的原理以及响应式数据的方法
2018/07/02 Javascript
记录一次完整的react hooks实践
2019/03/11 Javascript
javascript写一个ajax自动拦截并下载数据代码实例
2019/09/07 Javascript
JavaScript代码压缩工具UglifyJS和Google Closure Compiler的基本用法
2020/04/13 Javascript
Vue实现附件上传功能
2020/05/28 Javascript
[04:03]辉夜杯主赛事 12月25日RECAP精彩回顾
2015/12/26 DOTA
[45:34]完美世界DOTA2联赛PWL S3 Rebirth vs CPG 第一场 12.18
2020/12/19 DOTA
python中遍历文件的3个方法
2014/09/02 Python
Python中的复制操作及copy模块中的浅拷贝与深拷贝方法
2016/07/02 Python
python合并同类型excel表格的方法
2018/04/01 Python
python获取微信企业号打卡数据并生成windows计划任务
2019/04/30 Python
Python 私有化操作实例分析
2019/11/21 Python
Python 音频生成器的实现示例
2019/12/24 Python
HTML5 script元素async、defer异步加载使用介绍
2013/08/23 HTML / CSS
Html5 webRTC简单实现视频调用的示例代码
2020/09/23 HTML / CSS
美国在线医疗分销商:MedEx Supply
2020/02/04 全球购物
廉洁自律承诺书
2014/03/27 职场文书
关于教师节的广播稿
2014/09/10 职场文书
2014年护士工作总结范文
2014/11/11 职场文书
Redis持久化与主从复制的实践
2021/04/27 Redis