今天又学到了一点新知识,脑子记不住东西特把它记录下来!

页面ajax请求后台时一般都是返回字符串进行判断,要是返回list或者对象时该怎么办?

第一种:ajax接收到list并返回给前台

js代码:

  1. function test(obj){
  2. var str = $("#tt").val();
  3. webTest(str,function(result){
  4. alert(result);//将后台返回结果alert一下
  5. var list = eval(result);//解析json
  6. for(var i = 0;i < list.length;i++){//循环遍历数据
  7. var userinfo = list[i];
  8. alert(userinfo.name+"+"+userinfo.age+"+"+userinfo.sex+"+"+userinfo.address);
  9. }
  10. });
  11. }
function test(obj){
var str = $("#tt").val();
webTest(str,function(result){
alert(result);//将后台返回结果alert一下
var list = eval(result);//解析json
for(var i = 0;i < list.length;i++){//循环遍历数据
var userinfo = list[i];
alert(userinfo.name+"+"+userinfo.age+"+"+userinfo.sex+"+"+userinfo.address);
			}
});
}</pre><span style="white-space:pre;"></span>上面红字webTest方法(这里是调用webservice,和ajax处理流程一样)<div class="dp-highlighter bg_javascript"><div class="bar"><div class="tools"><b>[javascript]</b> <a href="#" class="ViewSource" title="view plain" onclick="dp.sh.Toolbar.Command('ViewSource',this);return false;">view plain</a><span data-mod="popu_168"> <a href="#" class="CopyToClipboard" title="copy" onclick="dp.sh.Toolbar.Command('CopyToClipboard',this);return false;">copy</a><div style="position: absolute; left: 540px; top: 803px; width: 16px; height: 16px; z-index: 99;"><embed id="ZeroClipboardMovie_2" src="https://csdnimg.cn/public/highlighter/ZeroClipboard.swf" loop="false" menu="false" quality="best" bgcolor="#ffffff" width="16" height="16" name="ZeroClipboardMovie_2" align="middle" allowscriptaccess="always" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" flashvars="id=2&amp;width=16&amp;height=16" wmode="transparent"></div><div style="position: absolute; left: 540px; top: 803px; width: 16px; height: 16px; z-index: 99;"><embed id="ZeroClipboardMovie_8" src="https://csdnimg.cn/public/highlighter/ZeroClipboard.swf" loop="false" menu="false" quality="best" bgcolor="#ffffff" width="16" height="16" name="ZeroClipboardMovie_8" align="middle" allowscriptaccess="always" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" flashvars="id=8&amp;width=16&amp;height=16" wmode="transparent"></div></span><span data-mod="popu_169"> <a href="#" class="PrintSource" title="print" onclick="dp.sh.Toolbar.Command('PrintSource',this);return false;">print</a></span><a href="#" class="About" title="?" onclick="dp.sh.Toolbar.Command('About',this);return false;">?</a></div></div><ol start="1" class="dp-c"><li class="alt"><span><span class="keyword">var</span><span>&nbsp;webTest&nbsp;=&nbsp;</span><span class="keyword">function</span><span>&nbsp;(test,&nbsp;callback)&nbsp;{&nbsp;&nbsp;</span></span></li><li class=""><span>&nbsp;&nbsp;&nbsp;&nbsp;<span class="keyword">var</span><span>&nbsp;soapMessage&nbsp;=&nbsp;</span><span class="string">'&lt;soapenv:Envelope&nbsp;xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/"&nbsp;xmlns:bs="http://inter.hs.com/"&gt;'</span><span>&nbsp;&nbsp;</span></span></li><li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;+&nbsp;<span class="string">'&lt;soapenv:Header/&gt;'</span><span>&nbsp;&nbsp;</span></span></li><li class=""><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;+&nbsp;<span class="string">'&lt;soapenv:Body&gt;'</span><span>&nbsp;&nbsp;</span></span></li><li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;+&nbsp;<span class="string">'&lt;bs:test&gt;'</span><span>&nbsp;&nbsp;</span></span></li><li class=""><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;+&nbsp;<span class="string">'&lt;para&gt;'</span><span>&nbsp;+&nbsp;test&nbsp;+&nbsp;</span><span class="string">'&lt;/para&gt;'</span><span>&nbsp;&nbsp;</span></span></li><li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;+&nbsp;<span class="string">'&lt;/bs:test&gt;'</span><span>&nbsp;&nbsp;</span></span></li><li class=""><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;+&nbsp;<span class="string">'&lt;/soapenv:Body&gt;'</span><span>&nbsp;&nbsp;</span></span></li><li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;+&nbsp;<span class="string">'&lt;/soapenv:Envelope&gt;'</span><span>;&nbsp;&nbsp;</span></span></li><li class=""><span>&nbsp;&nbsp;&nbsp;&nbsp;PostData(soapMessage,&nbsp;callback);&nbsp;&nbsp;</span></li><li class="alt"><span>}&nbsp;&nbsp;</span></li></ol></div><pre class="javascript" name="code" style="display: none;">var webTest = function (test, callback) {
var soapMessage = '&lt;soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:bs="http://inter.hs.com/"&gt;'
+ '&lt;soapenv:Header/&gt;'
+ '&lt;soapenv:Body&gt;'
+ '&lt;bs:test&gt;'
+ '&lt;para&gt;' + test + '&lt;/para&gt;'
+ '&lt;/bs:test&gt;'
+ '&lt;/soapenv:Body&gt;'
+ '&lt;/soapenv:Envelope&gt;';
PostData(soapMessage, callback);

}

后台代码:

  1. @Override
  2. public String test(String str) {
  3. List<UserInfo> list = new ArrayList<UserInfo>();
  4. UserInfo ui = new UserInfo();
  5. ui.setName("tom");
  6. ui.setAge(22);
  7. ui.setSex("男");
  8. ui.setAddress("陕西西安");
  9. list.add(ui);
  10. JSONObject ja = JSONObject.fromObject(list);//将list包装成json传递给前台
  11. return ja.toString();
  12. }
@Override
public String test(String str) {
List<UserInfo> list = new ArrayList<UserInfo>();
UserInfo ui = new UserInfo();
ui.setName("tom");
ui.setAge(22);
ui.setSex("男");
ui.setAddress("陕西西安");
list.add(ui);
JSONObject ja = JSONObject.fromObject(list);//将list包装成json传递给前台
return ja.toString();
}

运行结果:

第二种情况,接收对象数据返回:

js代码:

  1. <script>
  2. $("div.submit_op>input").click(function(){
  3. var uname = $("#acount").val();
  4. var pass = $("#pass").val();
  5. if(uname==""){
  6. alert("请输入用户名");
  7. }else if(pass == ""){
  8. alert("请输入密码");
  9. }else{
  10. ecLogin(uname,pass,function(result){//这一步可以堪称是ajax请求后台,result是返回结果
  11. if(result == "false"){
  12. alert("用户名或者密码错误");
  13. }else{
  14. var userinfo = eval(result)[0];//当是单个对象时,虽不用循环遍历,但是需要【0】取</span>
  15. alert(userinfo.user_reg_id);
  16. }
  17. });
  18. }
  19. })
  20. </script>
<script>
$("div.submit_op>input").click(function(){
var uname = $("#acount").val();
var pass = $("#pass").val();
if(uname==""){
alert("请输入用户名");
}else if(pass == ""){
alert("请输入密码");
}else{
ecLogin(uname,pass,function(result){//这一步可以堪称是ajax请求后台,result是返回结果
if(result == "false"){
alert("用户名或者密码错误");
}else{
var userinfo = eval(result)[0];//当是单个对象时,虽不用循环遍历,但是需要【0】取</span>
alert(userinfo.user_reg_id);
}
});
}
})

</script>

  1. /**
  2. * 登录接口
  3. * @param phone 手机号
  4. * @param pass 密码
  5. * @param callback func 回调函数,原型function(string) 其中参数为登录之后的用户对象或者null
  6. * @returns
  7. */
  8. var ecLogin = function (phone, pass, callback) {
  9. alert(phone);
  10. var soapMessage = '<soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:bs="http://inter.hs.com/">'
  11. + '<soapenv:Header/>'
  12. + '<soapenv:Body>'
  13. + '<bs:login>'
  14. + '<phone>' + phone + '</phone>'
  15. + '<pass>' + pass + '</pass>'
  16. + '</bs:login>'
  17. + '</soapenv:Body>'
  18. + '</soapenv:Envelope>';
  19. PostData(soapMessage, callback);
  20. }
/**
* 登录接口
* @param phone 手机号
* @param pass 密码
* @param callback func 回调函数,原型function(string) 其中参数为登录之后的用户对象或者null
* @returns
*/
var ecLogin = function (phone, pass, callback) {
alert(phone);
var soapMessage = '<soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:bs="http://inter.hs.com/">'
+ '<soapenv:Header/>'
+ '<soapenv:Body>'
+ '<bs:login>'
+ '<phone>' + phone + '</phone>'
+ '<pass>' + pass + '</pass>'
+ '</bs:login>'
+ '</soapenv:Body>'
+ '</soapenv:Envelope>';
PostData(soapMessage, callback);
}

后台代码:

  1. @Override
  2. public String login(String strPhone, String password) {
  3. String str = "false";
  4. Connection conn = DBManager.getConnection();
  5. String sql = "select * from tb_user_login where user_phone = ? and user_pwd = ?";
  6. PreparedStatement ps = null;
  7. ResultSet rs = null;
  8. try {
  9. ps = conn.prepareStatement(sql);
  10. ps.setString(1, strPhone);
  11. ps.setString(2, password);
  12. rs = ps.executeQuery();
  13. while (rs.next()){
  14. UserLogin ul = new UserLogin();
  15. ul.setUser_reg_id(rs.getString(1));
  16. ul.setUser_phone(rs.getString(2));
  17. JSONObject ja = JSONObject.fromObject(ul);
  18. str = ja.toString();
  19. }
  20. } catch (SQLException e) {
  21. e.printStackTrace();
  22. }
  23. return str;
  24. }
	@Override
public String login(String strPhone, String password) {
String str = "false";
Connection conn = DBManager.getConnection();
String sql = "select * from tb_user_login where user_phone = ? and user_pwd = ?";
PreparedStatement ps = null;
ResultSet rs = null;
try {
ps = conn.prepareStatement(sql);
ps.setString(1, strPhone);
ps.setString(2, password);
rs = ps.executeQuery();
while (rs.next()){
UserLogin ul = new UserLogin();
ul.setUser_reg_id(rs.getString(1));
ul.setUser_phone(rs.getString(2));
JSONObject ja = JSONObject.fromObject(ul);
str = ja.toString();
}
} catch (SQLException e) {
e.printStackTrace();
}
return str;
}

如有不对,还请各位大牛指正!

ajax接收json数据到js解析的更多相关文章

  1. 浅析ajax请求json数据并用js解析(示例分析)

    这应该是每个web开发的人员都应该掌握的基础技术,需要的朋友可以参考下 自从接触了jquery就喜欢上了前端开发,而且深深感受到了前端开发的强大与重要之处.同时也想为asp.net鸣不平,事实上asp ...

  2. ThinkPHP中使用ajax接收json数据的方法

    本文实例讲述了ThinkPHP中使用ajax接收json数据的方法.分享给大家供大家参考.具体分析如下: 这里通过ThinkPHP+jquery实现ajax,扩展了下,写了个查询,前台代码如下: 首先 ...

  3. ajax 接收json数据的进一步了解

    var url = "../searchclasses"; $.ajax({ url: url, type: "post", dataType: "j ...

  4. Ajax接收Json数据,调用template模板循环渲染页面的方法

    一. 后台接口吐出JSON数据 后台php接口中,需要写三个部分: 1.1 开头header规定数据格式: header("content-type:application/json;cha ...

  5. Ajax传递json数据简介和一个需要注意的小问题

    Ajax传递json数据 Ajax操作与json数据格式在实际中的运用十分广泛,本文为大家介绍一个两者相结合的小案例: 项目结构 我们新建一个Django项目,在里面创建一个名为app01的应用: p ...

  6. 通过js获取前台数据向一般处理程序传递Json数据,并解析Json数据,将前台传来的Json数据写入数据库表中

    摘自:http://blog.csdn.net/mazhaojuan/article/details/8592015 通过js获取前台数据向一般处理程序传递Json数据,并解析Json数据,将前台传来 ...

  7. AJAX如何接收JSON数据

    简介 在我们了解如何使用AJAX返回JSON数据的时候要先明白下列几点 1. JSON如何来表示对象的 2. JSON如何来表示数组的 var object = { "labId" ...

  8. js进阶ajax读取json数据(ajax读取json和读取普通文本,和获取服务器返回数据(链接)都是一样的,在url处放上json文件的地址即可)

    js进阶ajax读取json数据(ajax读取json和读取普通文本,和获取服务器返回数据(链接)都是一样的,在url处放上json文件的地址即可) 一.总结 ajax读取json和读取普通文本,和获 ...

  9. Jquery的$.ajax、$.get、$.post发送、接收JSON数据及回调函数用法

    平时研究代码时,经常会遇到AJAX的相关用法,做项目时才真正体会到Ajax的强大之处(与服务器数据交互如此之便捷,更新DOM节点而不用刷新整个页面),以及运用的频繁程度.今天整理了一下自己之前没搞清楚 ...

随机推荐

  1. [转]Getting Started with ASP.NET Web API 2 (C#)

    http://www.asp.net/web-api 本文转自:http://www.asp.net/web-api/overview/getting-started-with-aspnet-web- ...

  2. css靠左,靠右

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. vue组件中—bus总线事件回调函数多次执行的问题

    在利用vue组件进行事件监听时发现,如果对N个vue组件实例的bus总线绑定同一事件的回调函数,触发任意组件的对应事件,回调函数至少会被执行N次,这是为什么呢? 为此,调研了普通对象的事件绑定和触发实 ...

  4. 前端--1、HTML基础

    web服务 处于应用层的http协议负责的数据传输与解析.位于socket上层,用socket传输http数据时需要在消息开头处声明是http协议/相应http版本 状态码 状态码含义 \r\n\r\ ...

  5. iOS Programming Editing UITableView

    iOS Programming Editing UITableView 1.1 Editing mode  UITableView has an editing property, and when ...

  6. table鼠标滑过变颜色

    table鼠标滑过变颜色 添加 table tr:hover{background-color: #eee;} 设置鼠标滑过行背景变色,重新刷新浏览器页面.  一般设置灰色,eee

  7. C++ class、struct区别

    一.默认访问控制不同(最主要) struct默认为public,class默认为private.这个访问控制既是指成员的默认访问属性,又指继承时默认的继承属性. 二.定义template时不同 在模版 ...

  8. swift class type isa-swizzling

    class 是引用类型,生成的实例分布在 Heap(堆) 内存区域上,在 Stack(栈)只存放着一个指向堆中实例的指针.因为考虑到引用类型的动态性和 ARC 的原因,class 类型实例需要有一块单 ...

  9. Java IO(一)--File类

    File类不是单指文件,它既可以代表一个文件名称,又可以代表一个目录下的一组文件.可以用来创建.删除.遍历文件等 public static void main(String[] args) { St ...

  10. java正则表达式的进阶使用20180912

    package org.jimmy.autosearch20180821.test; import java.util.regex.Matcher; import java.util.regex.Pa ...