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 相关文章推荐
关于javascript中的typeof和instanceof介绍
Dec 04 Javascript
js关闭浏览器窗口及检查浏览器关闭事件
Sep 03 Javascript
jquery默认校验规则整理
Mar 24 Javascript
JavaScript中操作字符串之localeCompare()方法的使用
Jun 06 Javascript
BootStrap iCheck插件全选与获取value值的解决方法
Aug 24 Javascript
Bootstrap和Angularjs配合自制弹框的实例代码
Aug 24 Javascript
总结几道关于Node.js的面试问题
Jan 11 Javascript
Angular使用cli生成自定义文件、组件的方法
Sep 04 Javascript
Vue实现剪贴板复制功能
Dec 31 Javascript
ant design vue datepicker日期选择器中文化操作
Oct 28 Javascript
原生js实现自定义难度的扫雷游戏
Jan 22 Javascript
el-table-column 内容不自动换行的解决方法
Aug 14 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 strtok()函数的优点分析
2010/03/02 PHP
ExtJS与PHP、MySQL实现存储的方法
2010/04/02 PHP
PHP 小心urldecode引发的SQL注入漏洞
2011/10/27 PHP
yii实现级联下拉菜单的方法
2014/07/31 PHP
php从数组中随机选择若干不重复元素的方法
2015/03/14 PHP
PHP preg_match实现正则表达式匹配功能【输出是否匹配及匹配值】
2017/07/19 PHP
学习YUI.Ext第七日-View&amp;JSONView Part Two-一个画室网站的案例
2007/03/10 Javascript
jQuery live( type, fn ) 委派事件实现
2009/10/11 Javascript
jquery实现简单的自动播放幻灯片效果
2015/06/13 Javascript
Express实现前端后端通信上传图片之存储数据库(mysql)傻瓜式教程(一)
2015/12/10 Javascript
jquery滚动条插件(可以自定义)
2016/12/11 Javascript
JS中append字符串包含onclick无效传递参数失败的解决方案
2016/12/26 Javascript
JavaScript判断浏览器及其版本信息
2017/01/20 Javascript
PHP实现本地图片上传和验证功能
2017/02/27 Javascript
微信小程序实现tab左右切换效果
2020/11/15 Javascript
微信小程序tabbar底部导航
2018/11/05 Javascript
详解vue项目打包步骤
2019/03/29 Javascript
vue.js 2.*项目环境搭建、运行、打包发布的详细步骤
2019/05/01 Javascript
JS中作用域以及变量范围分析
2020/07/18 Javascript
[01:47]2018年度DOTA2最具人气解说-完美盛典
2018/12/16 DOTA
Python中的map、reduce和filter浅析
2014/04/26 Python
Python实现统计英文文章词频的方法分析
2019/01/28 Python
tensorflow tf.train.batch之数据批量读取方式
2020/01/20 Python
Mysql数据库反向生成Django里面的models指令方式
2020/05/18 Python
监理员的岗位职责
2013/11/13 职场文书
大学生涯自我鉴定
2014/01/16 职场文书
社区中秋节活动方案
2014/01/29 职场文书
九年级物理教学反思
2014/01/29 职场文书
暖通工程师岗位职责
2014/06/12 职场文书
关于教师节的演讲稿
2014/09/04 职场文书
委托收款证明
2015/06/23 职场文书
伊索寓言读书笔记
2015/06/30 职场文书
自定义函数实现单词排序并运用于PostgreSQL(实现代码)
2021/04/22 PostgreSQL
Nginx动静分离配置实现与说明
2022/04/07 Servers
Java版 单机五子棋
2022/05/04 Java/Android
如何用H5实现好玩的2048小游戏
2022/07/23 HTML / CSS