ajax接收json数据到js解析
今天又学到了一点新知识,脑子记不住东西特把它记录下来!
页面ajax请求后台时一般都是返回字符串进行判断,要是返回list或者对象时该怎么办?
第一种:ajax接收到list并返回给前台
js代码:
- 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);
- }
- });
- }
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&width=16&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&width=16&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> webTest = </span><span class="keyword">function</span><span> (test, callback) { </span></span></li><li class=""><span> <span class="keyword">var</span><span> soapMessage = </span><span class="string">'<soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:bs="http://inter.hs.com/">'</span><span> </span></span></li><li class="alt"><span> + <span class="string">'<soapenv:Header/>'</span><span> </span></span></li><li class=""><span> + <span class="string">'<soapenv:Body>'</span><span> </span></span></li><li class="alt"><span> + <span class="string">'<bs:test>'</span><span> </span></span></li><li class=""><span> + <span class="string">'<para>'</span><span> + test + </span><span class="string">'</para>'</span><span> </span></span></li><li class="alt"><span> + <span class="string">'</bs:test>'</span><span> </span></span></li><li class=""><span> + <span class="string">'</soapenv:Body>'</span><span> </span></span></li><li class="alt"><span> + <span class="string">'</soapenv:Envelope>'</span><span>; </span></span></li><li class=""><span> PostData(soapMessage, callback); </span></li><li class="alt"><span>} </span></li></ol></div><pre class="javascript" name="code" style="display: none;">var webTest = function (test, callback) {
var soapMessage = '<soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:bs="http://inter.hs.com/">'
+ '<soapenv:Header/>'
+ '<soapenv:Body>'
+ '<bs:test>'
+ '<para>' + test + '</para>'
+ '</bs:test>'
+ '</soapenv:Body>'
+ '</soapenv:Envelope>';
PostData(soapMessage, callback);
}
后台代码:
- @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();
- }
@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代码:
- <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>
<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>
- /**
- * 登录接口
- * @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);
- }
/**
* 登录接口
* @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);
}
后台代码:
- @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;
- }
@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解析的更多相关文章
- 浅析ajax请求json数据并用js解析(示例分析)
这应该是每个web开发的人员都应该掌握的基础技术,需要的朋友可以参考下 自从接触了jquery就喜欢上了前端开发,而且深深感受到了前端开发的强大与重要之处.同时也想为asp.net鸣不平,事实上asp ...
- ThinkPHP中使用ajax接收json数据的方法
本文实例讲述了ThinkPHP中使用ajax接收json数据的方法.分享给大家供大家参考.具体分析如下: 这里通过ThinkPHP+jquery实现ajax,扩展了下,写了个查询,前台代码如下: 首先 ...
- ajax 接收json数据的进一步了解
var url = "../searchclasses"; $.ajax({ url: url, type: "post", dataType: "j ...
- Ajax接收Json数据,调用template模板循环渲染页面的方法
一. 后台接口吐出JSON数据 后台php接口中,需要写三个部分: 1.1 开头header规定数据格式: header("content-type:application/json;cha ...
- Ajax传递json数据简介和一个需要注意的小问题
Ajax传递json数据 Ajax操作与json数据格式在实际中的运用十分广泛,本文为大家介绍一个两者相结合的小案例: 项目结构 我们新建一个Django项目,在里面创建一个名为app01的应用: p ...
- 通过js获取前台数据向一般处理程序传递Json数据,并解析Json数据,将前台传来的Json数据写入数据库表中
摘自:http://blog.csdn.net/mazhaojuan/article/details/8592015 通过js获取前台数据向一般处理程序传递Json数据,并解析Json数据,将前台传来 ...
- AJAX如何接收JSON数据
简介 在我们了解如何使用AJAX返回JSON数据的时候要先明白下列几点 1. JSON如何来表示对象的 2. JSON如何来表示数组的 var object = { "labId" ...
- js进阶ajax读取json数据(ajax读取json和读取普通文本,和获取服务器返回数据(链接)都是一样的,在url处放上json文件的地址即可)
js进阶ajax读取json数据(ajax读取json和读取普通文本,和获取服务器返回数据(链接)都是一样的,在url处放上json文件的地址即可) 一.总结 ajax读取json和读取普通文本,和获 ...
- Jquery的$.ajax、$.get、$.post发送、接收JSON数据及回调函数用法
平时研究代码时,经常会遇到AJAX的相关用法,做项目时才真正体会到Ajax的强大之处(与服务器数据交互如此之便捷,更新DOM节点而不用刷新整个页面),以及运用的频繁程度.今天整理了一下自己之前没搞清楚 ...
随机推荐
- WinForm 里面关闭窗体的两个方法的区别 Form.coles()与Application,Exit()
- BufferedStream
处理流,包在别的流上面的流,相当于包到别的管道上面的管道. 缓冲刘: 缓冲流,就是带小桶的带缓冲区的. 那两个方法知道一下就好了,不必深究…… bis.read() read一下读一个出来 bi ...
- APP热修复
APP热修复的概念: APP修复是针对修复app中的bug场景来定义的.当我们已上线的app出现bug的时候,我们想在用户不知情的情况下修复这个bug,那么就会用到热修复. APP热修复的实现原理: ...
- 框架系列~OwinSelfHost自宿主的使用
在进入mvc5之后,OWIN变更很主推,很热,关于OWIN的文章也就出来了,下面阅读了dudu和一些园友的文章,自己也做了一个SelfHost的程序,测试了一下,感觉还是比较有Core的风格,可能也是 ...
- webapp开发学习---Cordova环境搭建
Cordova 使用HTML, CSS & JS进行移动App开发;多平台共用一套代码;免费开源 步骤:(来自Cordova官网) 1.安装Cordova(在node.js环境下进行安装) 命 ...
- Xml学习笔记(1)
不同的xml文档构可能要用到不同的方法进行解析这里用到的是例如<student name="张三" id="1" sex="男"/&g ...
- GIT配置及用法
ssh配置 TortoiseGit配置 用法: 下面是我整理的常用 Git 命令清单.几个专用名词的译名如下. Workspace:工作区 Index / Stage:暂存区 Repository:仓 ...
- [BZOJ1005][HNOI2008]明明的烦恼 数学+prufer序列+高精度
#include<cstdio> #include<cstring> #include<algorithm> using namespace std; int N; ...
- WP7 开发资料
前言 离Windows Phone 7正式发布已过去几个月了,但国内关于Windows Phone 7的中文书籍资料太少了,大多数是英文资料,一本真正的中文开发教程书都没有, 要啃英文资料对大部分的开 ...
- pandas 选择某几列
转自:https://blog.csdn.net/aaa_aaa1sdf/article/details/77414387 col_n = ['名称','收盘价','日期'] a = pd.DataF ...