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 相关文章推荐
node.js中的fs.readlinkSync方法使用说明
Dec 17 Javascript
JavaScript中setMonth()方法的使用详解
Jun 11 Javascript
jQuery实现文本框输入同步的方法
Jun 20 Javascript
js表单验证实例讲解
Mar 31 Javascript
手机移动端实现 jquery和HTML5 Canvas的幸运大奖盘特效
Dec 06 Javascript
Vue中使用vux的配置详解
May 05 Javascript
详解vue-router 2.0 常用基础知识点之router.push()
May 10 Javascript
Node.js成为Web应用开发最佳选择的原因
Feb 05 Javascript
vue2.0 axios跨域并渲染的问题解决方法
Mar 08 Javascript
vue.js做一个简单的编辑菜谱功能
May 08 Javascript
Vue实现底部侧边工具栏的实例代码
Sep 03 Javascript
Vue实现点击导航栏当前标签后变色功能
Aug 19 Javascript
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概述.
2006/10/09 PHP
ThinkPHP多语言支持与多模板支持概述
2014/08/22 PHP
基于PHP实现的事件机制实例分析
2015/06/18 PHP
php给图片加文字水印
2015/07/31 PHP
php设计模式之观察者模式实例详解【星际争霸游戏案例】
2020/03/30 PHP
解决使用attachEvent函数时,this指向被绑定的元素的问题的方法
2007/08/13 Javascript
css把超出的部分显示为省略号的方法兼容火狐
2008/07/23 Javascript
js和as的稳定传值问题解决
2013/07/14 Javascript
js获取指定的cookie的具体实现
2014/02/20 Javascript
JavaScript程序员应该知道的45个实用技巧
2014/03/04 Javascript
通过Jquery的Ajax方法读取将table转换为Json
2014/05/31 Javascript
JS实现文字掉落效果的方法
2015/05/06 Javascript
Jquery on绑定的事件 触发多次实例代码
2016/12/08 Javascript
JS小数转换为整数的方法分析
2017/01/07 Javascript
Angular.Js之Scope作用域的学习教程
2017/04/27 Javascript
xmlplus组件设计系列之下拉刷新(PullRefresh)(6)
2017/05/03 Javascript
electron-vue利用webpack打包实现多页面的入口文件问题
2019/05/12 Javascript
微信小程序tabBar设置实例解析
2019/11/14 Javascript
微信小程序 bindtap 传参的实例代码
2020/02/21 Javascript
[03:07]2015国际邀请赛选手档案EHOME.rOtK 是什么让他落泪?
2015/07/31 DOTA
Python使用面向对象方式创建线程实现12306售票系统
2015/12/24 Python
Python模拟登陆淘宝并统计淘宝消费情况的代码实例分享
2016/07/04 Python
python之Socket网络编程详解
2016/09/29 Python
Python装饰器原理与用法分析
2018/04/30 Python
python中实现控制小数点位数的方法
2019/01/24 Python
深入了解Django View(视图系统)
2019/07/23 Python
基于opencv的selenium滑动验证码的实现
2020/07/24 Python
HTML5中的nav标签学习笔记
2016/06/24 HTML / CSS
Lookfantastic希腊官网:英国知名美妆购物网站
2018/09/15 全球购物
如果NULL和0作为空指针常数是等价的,那我到底该用哪一个
2014/09/16 面试题
传统软件工程与面向对象的软件工程有什么区别
2012/05/31 面试题
新员工培训个人的自我评价
2013/10/09 职场文书
平民服装店创业计划书
2014/01/17 职场文书
2014年平安夜寄语
2014/12/08 职场文书
大学毕业生自我鉴定范文
2019/06/21 职场文书
HTML页面中使两个div并排显示的实现
2022/05/15 HTML / CSS