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操作css样式
May 15 jQuery
关于jQuery.ajax()的jsonp碰上post详解
Jul 02 jQuery
jQuery+ajax实现修改密码验证功能实例详解
Jul 06 jQuery
jQuery上传插件webupload使用方法
Aug 01 jQuery
jQuery实现上传图片前预览效果功能
Aug 03 jQuery
jquery写出PC端轮播图实例
Jan 26 jQuery
jQuery仿移动端支付宝键盘的实现代码
Aug 15 jQuery
详解jQuery获取特殊属性的值以及设置内容
Nov 14 jQuery
jQuery.parseJSON()函数详解
Feb 28 jQuery
jQuery实现图片随机切换、抽奖功能(实例代码)
Oct 23 jQuery
jQuery实现放大镜案例
Oct 19 jQuery
jQuery实现简单弹幕制作
Dec 10 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
thinkphp模板输出技巧汇总
2014/11/24 PHP
php实现统计目录文件大小的函数
2015/12/25 PHP
PHP多维数组元素操作类的方法
2016/11/14 PHP
PHP数据分析引擎计算余弦相似度算法示例
2017/08/08 PHP
使用PHP+MySql+Ajax+jQuery实现省市区三级联动功能示例
2017/09/15 PHP
PHP7新特性
2021/03/09 PHP
js window.event对象详尽解析
2009/02/17 Javascript
jQuery操作Select选择的Text和Value(获取/设置/添加/删除)
2013/03/06 Javascript
JavaScript获取按钮所在form表单id的方法
2015/04/02 Javascript
js判断子窗体是否关闭的方法
2015/08/11 Javascript
JS实现的在线调色板实例(附demo源码下载)
2016/03/01 Javascript
js实现的简单图片浮动效果完整实例
2016/05/10 Javascript
jQuery解决$符号命名冲突
2016/06/18 Javascript
require.js 加载 vue组件 r.js 合并压缩的实例
2016/10/14 Javascript
Vue.js 60分钟快速入门教程
2017/03/28 Javascript
jQuery简单实现对数组去重及排序操作实例
2017/10/31 jQuery
浅谈vue引入css,less遇到的坑和解决方法
2018/01/20 Javascript
NodeJS 中Stream 的基本使用
2018/07/30 NodeJs
Vue Router去掉url中默认的锚点#
2018/08/01 Javascript
Element输入框带历史查询记录的实现示例
2019/01/15 Javascript
js中对象和面向对象与Json介绍
2019/01/21 Javascript
JavaScript碎片—函数闭包(模拟面向对象)
2019/03/13 Javascript
layui实现下拉复选功能的例子(包括数据的回显与上传)
2019/09/24 Javascript
Python实现的单向循环链表功能示例
2017/11/10 Python
python获取命令行输入参数列表的实例代码
2018/06/23 Python
利用Python如何实现一个小说网站雏形
2018/11/23 Python
Python Django 封装分页成通用的模块详解
2019/08/21 Python
使用python 的matplotlib 画轨道实例
2020/01/19 Python
CSS3的transition和animation的用法实例介绍
2014/08/20 HTML / CSS
Html5跳转到APP指定页面的实现
2020/01/14 HTML / CSS
村党支部书记四风问题个人对照检查材料思想汇报
2014/10/06 职场文书
生产现场禁烟通知
2015/04/23 职场文书
多人股份制合作协议书
2016/03/19 职场文书
详解redis分布式锁的这些坑
2021/05/19 Redis
vue中利用mqtt服务端实现即时通讯的步骤记录
2021/07/01 Vue.js
永中文档在线转换预览基于nginx配置部署方案
2022/06/10 Servers