jquery ajax例子返回值详解


Posted in Javascript onSeptember 11, 2012

在JQuery中,AJAX有三种实现方式:$.ajax() , $.post , $.get()。
首先我们看$.get():

$.get("test.jsp", 
{ name: "cssrain", time: "2008/01/21" }, //要传递的数据 
function(data){ 
alert("返回的数据: " + data); 
} 
)

然后看$.post():
跟$.get()格式一样.
$.post("test.jsp", 
{ name: "cssrain", time: "2008/01/21" }, //要传递的数据 
function(data){ 
alert("返回的数据: " + data); 
} 
)

上面2种方式的区别应该就是 请求方式不同(一个get 一个post).
最后我们看$.ajax():
$.ajax({ 
url:'Accept.jsp', 
type:'post', //数据发送方式 
dataType:'html', //接受数据格式 (这里有很多,常用的有html,xml,js,json) 
data:'text='+$("#name").val()+'&date='+new Date(), //要传递的数据 
error: function(){ //失败 
alert('Error loading document'); 
}, 
success: function(msg){ //成功 
alert( "Data Saved: " + msg ); 
} 
});

实例
前台jsp部分的代码如下:...
票数:
<span id="i<%=id%>"><%=vote_number%></span><br/> 
<a onclick=myvote(<%=id%>); href='javascript:;'">投票</a>

...
js部分的代码如下
function myvote(id){ 
$.post("vote.jsp", { id: id }, 
function(data){ 
eval("var data="+data); 
if (data.issucc=="0"){ 
alert(data.mess) 
}else{ 
//alert("更新页面"); 
$("#i"+data.myid).html(data.votenum); 
} 
}); 
}

返回数据为json
后台返回的json数据如下
{issucc:,mess:”“,votenum:,myid:}
issucc:是否成功
mess:信息,主要是错误信息,比如没登录,超过限制等
votenum:投票后的得票总数
myid:投票的id,用于更新页面的投票数
一个注册登录实例
js
login.jsp返回的类型为text形式,正确时是“OK”,错误时是
“error”。
var userName; 
var password; 
var result; 
$(document).ready(function(){ 
$("#load").hide(); 
$("#success").hide(); 
$("#error").hide(); 
}); 
$(document).ready(function(){ 
$("#button").click(function(){ 
$("#error").hide(); 
$("#load").show("slow"); 
userName = $("#userName").val(); 
password = $("#password").val(); 
$.ajax({type: "post", 
url: "login.jsp", 
dataType: "html", 
data: "userName="+userName+"&password="+password, 
success: function(result){ 
var res = String($.trim(result)); 
if(res=="OK"){ 
$("#myTable").hide("slow"); 
$("#success").show("slow"); 
}else if(res=="error"){ 
$("#error").show("slow"); 
$("#load").hide("slow"); 
}else{ 
alert("返回异常");} 
} 
}); 
}); 
});

jsp页面
第一种responseText格式
<%@ page language="java" pageEncoding="gb2312"%> 
<% 
String userName = request.getParameter("userName"); 
String password = request.getParameter("password"); 
if(password.equals("longleg")&&userName.equals("thy")){ 
out.print("OK"); 
}else{out.print("error");} 
%>
Javascript 相关文章推荐
IE6/7/8/9不支持exec的简写方式
May 25 Javascript
jquery 插件开发 extjs中的extend用法小结
Jan 04 Javascript
javascript ie6兼容position:fixed实现思路
Apr 01 Javascript
js 时间格式与时间戳的相互转换示例代码
Dec 25 Javascript
使用jquery实现的一个图片延迟加载插件(含图片延迟加载原理)
Jun 05 Javascript
js和jquery中循环的退出和继续下一个循环
Sep 03 Javascript
页面加载完后自动执行一个方法的js代码
Sep 06 Javascript
JavaScript中判断原生函数检查function是否是原生代码
Sep 09 Javascript
jQuery+css实现的切换图片功能代码
Jan 27 Javascript
vue中实现上传文件给后台实例详解
Aug 22 Javascript
在Vue中使用Echarts实例图的方法实例
Oct 10 Javascript
详解vue3中组件的非兼容变更
Mar 03 Vue.js
Jquery插件写法笔记整理
Sep 06 #Javascript
基于jquery的用鼠标画出可移动的div
Sep 06 #Javascript
js防止表单重复提交实现代码
Sep 05 #Javascript
javascript面向对象入门基础详细介绍
Sep 05 #Javascript
说说JSON和JSONP 也许你会豁然开朗
Sep 02 #Javascript
自己实现string的substring方法 人民币小写转大写,数字反转,正则优化
Sep 02 #Javascript
Javascript中的delete介绍
Sep 02 #Javascript
You might like
php preg_filter执行一个正则表达式搜索和替换
2012/02/27 PHP
php eval函数用法 PHP中eval()函数小技巧
2012/10/31 PHP
合并ThinkPHP配置文件以消除代码冗余的实现方法
2014/07/22 PHP
公共js在页面底部加载的注意事项介绍
2013/07/18 Javascript
JS中prototype的用法实例分析
2015/03/19 Javascript
jQuery实现防止提交按钮被双击的方法
2015/03/24 Javascript
jQuery实现转动随机数抽奖效果的方法
2015/05/21 Javascript
javascript:void(0)点击登录没反应怎么解决
2015/11/13 Javascript
JavaScript兼容性总结之获取非行间样式案例
2016/08/07 Javascript
基于JavaScript实现鼠标向下滑动加载div的代码
2016/08/31 Javascript
AngularJS使用自定义指令替代ng-repeat的方法
2016/09/17 Javascript
Bootstrap轮播图学习使用
2017/02/10 Javascript
Vue列表渲染的示例代码
2018/11/01 Javascript
vue动态配置模板 'component is'代码
2019/07/04 Javascript
详解JavaScript中分解数字的三种方法
2021/01/05 Javascript
[02:40]DOTA2殁境神蚀者 英雄基础教程
2013/11/26 DOTA
[57:16]2014 DOTA2华西杯精英邀请赛 5 25 LGD VS VG第二场
2014/05/26 DOTA
python中合并两个文本文件并按照姓名首字母排序的例子
2014/04/25 Python
详解Python多线程
2016/11/14 Python
python获取本机所有IP地址的方法
2018/12/26 Python
Python检查图片是否损坏及图片类型是否正确过程详解
2019/09/30 Python
Python 爬虫实现增加播客访问量的方法实现
2019/10/31 Python
Django 自动生成api接口文档教程
2019/11/19 Python
python判断正负数方式
2020/06/03 Python
表单button的outline在firefox浏览器下的问题
2012/12/24 HTML / CSS
CSS3弹性盒模型flex box快速入门心得(必看篇)
2016/05/24 HTML / CSS
美国在线印刷公司:PsPrint
2017/10/12 全球购物
印度第一网上礼品店:IGP.com
2020/02/06 全球购物
Swanson中国官网:美国斯旺森健康产品公司
2021/03/01 全球购物
给分销商的致歉信
2014/01/14 职场文书
黄继光的英雄事迹材料
2014/02/13 职场文书
投资意向书范本
2014/04/01 职场文书
创建绿色社区汇报材料
2014/08/22 职场文书
授权委托书
2014/09/17 职场文书
python某漫画app逆向
2021/03/31 Python
sql注入教程之类型以及提交注入
2021/08/02 MySQL