jQuery的Ajax接收java返回数据方法


Posted in jQuery onAugust 11, 2018

1.前端Ajax请求如下:

$.ajax({
  type : "post",
  //async:false,
  url : PATH + "/product/selectPicture.action",
  dataType : "json",
  success : function(data) {
   $.each(data,function(k,v){
     alert(k +":"+ v);
    });
  }
 });

2 其中PATH在jsp页面中定义:

<%
String path=request.getContextPath();
%>
<script>
 var PATH = ‘<%=path%>';
</script>

2.1 后端java代码输出json格式数据:

List<Map<String,Object>> list = bo.selectData();
response.setContentType("application/json;charset=GBK");
PrintWriter out=response.getWriter();  
out.write(JSONArray.fromObject(list).toString());
out.flush();
out.close();

其中list为从数据库中查出的数据,JSONArray.fromObject(list)需要导入json-lib-2.4-jdk15.jar包,而且这个包需要在导入几个依赖包才能用这个百度一下吧。注意返回的格式为json,和编码格式。

2.2 也可以使用alibaba的fastjson1.2.8.jar包,那么后端就该这么写:

List<Map<String,Object>> list = productService.selectCategory();
String jsonString = JSON.toJSONString(list, true); 
response.setContentType("application/json;charset=utf-8"); 
PrintWriter out = response.getWriter();
out.write(jsonString);
out.flush();
out.close();

2.3 如果后端用的是基于注解的springMVC,就这么写:

@ResponseBody
public JSONArray selectData(HttpServletRequest request){ 
  List<Map<String,Object>> list= bo.selectData(); 
  return JSONArray.fromObject(list);
 }

就是在方法前加上@ResponseBody注解,并return json格式的数据即可。

3 如果Ajax要求返回的数据类型为 dataType : “html”,那么后端java就是:

String key = bo.selectData();
response.setContentType("text/html;charset=utf-8");
Writer out = response.getWriter();
out.write(key);
out.flush();
out.close();

在Ajax的success : function(data) { }方法中,data就是就是从后端返回的数据。

以上这篇jQuery的Ajax接收java返回数据方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jQuery EasyUI 组件加上“清除”功能实例详解
Apr 11 jQuery
jQuery插件artDialog.js使用与关闭方法示例
Oct 09 jQuery
jQuery响应滚动条事件功能示例
Oct 14 jQuery
jQuery实现弹窗下底部页面禁止滑动效果
Dec 19 jQuery
jQuery实现的淡入淡出与滑入滑出效果示例
Apr 18 jQuery
JS文件中加载jquery.js的实例代码
May 05 jQuery
浅析vue-router jquery和params传参(接收参数)$router $route的区别
Aug 03 jQuery
jQuery常见的遍历DOM操作详解
Sep 05 jQuery
jQuery 隐藏/显示效果函数用法实例分析
May 20 jQuery
Jquery ajax书写方法代码实例解析
Jun 12 jQuery
基于jQuery拖拽事件的封装
Nov 29 jQuery
jQuery实现购物车全功能
Jan 11 jQuery
jquery ajax加载数据前台渲染方式 不用for遍历的方法
Aug 09 #jQuery
Vue.js 通过jQuery ajax获取数据实现更新后重新渲染页面的方法
Aug 09 #jQuery
JQuery Ajax动态加载Table数据的实例讲解
Aug 09 #jQuery
使用jquery DataTable和ajax向页面显示数据列表的方法
Aug 09 #jQuery
jQuery 实现批量提交表格多行数据的方法
Aug 09 #jQuery
jQuery AJAX 方法success()后台传来的4种数据详解
Aug 08 #jQuery
通过jquery的ajax请求本地的json文件方法
Aug 08 #jQuery
You might like
php 中文处理函数集合
2008/08/27 PHP
input按钮的事件处理大全
2010/12/10 Javascript
JS实现距离上次刷新已过多少秒示例
2014/05/23 Javascript
Jquery节点遍历next与nextAll方法使用示例
2014/07/22 Javascript
小结Node.js中非阻塞IO和事件循环
2014/09/18 Javascript
JavaScript获取网页、浏览器、屏幕高度和宽度汇总
2014/12/18 Javascript
不依赖Flash和任何JS库实现文本复制与剪切附源码下载
2015/10/09 Javascript
Vue精简版风格指南(推荐)
2018/01/30 Javascript
nodejs使用redis作为缓存介质实现的封装缓存类示例
2018/02/07 NodeJs
vue init webpack myproject构建项目 ip不能访问的解决方法
2018/03/20 Javascript
axios向后台传递数组作为参数的方法
2018/08/11 Javascript
vue实现匀速轮播效果
2020/06/29 Javascript
原生JavaScript实现轮播图
2021/01/10 Javascript
Python爬虫中urllib库的进阶学习
2018/01/05 Python
python读取TXT每行,并存到LIST中的方法
2018/10/26 Python
python 监听salt job状态,并任务数据推送到redis中的方法
2019/01/14 Python
Linux上使用Python统计每天的键盘输入次数
2019/04/17 Python
ipython和python区别详解
2019/06/26 Python
python datetime处理时间小结
2020/04/16 Python
PyQt5 控件字体样式等设置的实现
2020/05/13 Python
基于Python的接口自动化读写excel文件的方法
2021/01/15 Python
使用HTML5捕捉音频与视频信息概述及实例
2018/08/22 HTML / CSS
小橄榄树:Le Petit Olivier
2018/04/23 全球购物
汇智创新科技发展有限公司
2015/12/06 面试题
财务会计人员岗位职责
2013/11/30 职场文书
车间操作工岗位职责
2013/12/19 职场文书
校园十佳歌手策划书
2014/01/22 职场文书
产品设计开发计划书
2014/05/07 职场文书
幼儿园端午节活动方案
2014/08/25 职场文书
毕业横幅标语
2014/10/08 职场文书
2014年绩效考核工作总结
2014/12/11 职场文书
不同意离婚代理词
2015/05/23 职场文书
实习感想范文
2015/08/10 职场文书
采购员工作总结范文
2015/08/12 职场文书
外出考察学习心得体会
2016/01/18 职场文书
小学语文教师竞聘演讲稿范文
2019/08/09 职场文书