ajax接收后台数据在html页面显示


Posted in Javascript onFebruary 19, 2017

Java代码

PrintWriter out=response.getWriter(); //向客户端发送字符数据
 response.setContentType("text/text"); //设置请求以及响应的内容类型以及编码方式
 response.setCharacterEncoding("UTF-8");
 JSONArray json = JSONArray.fromObject(newsList); //将newsList对象转换为json对象
 String str = json.toString(); //将json对象转换为字符串
 out.write(str); //将str字符传输到前台
 

Ajax代码

$(document).ready(function() {
 $.ajax({
 url : "newsservlet",//请求地址
 dataType : "json",//数据格式 
 type : "post",//请求方式
 async : false,//是否异步请求
 success : function(data) { //如何发送成功
 var html = "";
 for(var i=0;i<data.length;i++){ //遍历data数组
 var ls = data[i]; 
 html +="<li><a href='second page text.html?newsid="+ls.news_id+"'class='infNews_wrod_a'><span>"+ls.news_name+"</span></a><span class='date'>"+ls.news_time+"</span></li>";
 }
 $("#ulul").html(html); //在html页面id=ulul的标签里显示html内容
 },
})
})

HTML页面

<ul id="ulul"></ul>

在ajax中,"#"代表的是一个标签的id,"."代表的是一个标签的class

在Java后台, 设置请求以及响应的内容类型以及编码方式  必须写在 json对象转换字符串 之前 ,否则会造成json中文乱码

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
JavaScript 未结束的字符串常量常见解决方法
Jan 24 Javascript
怎么引入(调用)一个JS文件
May 26 Javascript
使用JQuery 加载页面时调用JS的实现方法
May 30 Javascript
第三篇Bootstrap网格基础
Jun 21 Javascript
浅析JavaScript中命名空间namespace模式
Jun 22 Javascript
jquery表单插件Autotab使用方法详解
Jun 24 Javascript
bootstrap选项卡使用方法解析
Jan 11 Javascript
Node.js的特点详解
Feb 03 Javascript
JS对象创建的几种方式整理
Feb 28 Javascript
nvm、nrm、npm 安装和使用详解(小结)
Jan 17 Javascript
微信小程序mpvue点击按钮获取button值的方法
May 29 Javascript
JavaScript Html实现移动端红包雨功能页面
Jan 10 Javascript
Boostrap栅格系统与自己额外定义的媒体查询的冲突问题
Feb 19 #Javascript
JavaScript中无法通过div.style.left获取值的解决方法
Feb 19 #Javascript
JS获取浮动(float)元素的style.left值为空的快速解决办法
Feb 19 #Javascript
Angular 输入框实现自定义验证功能
Feb 19 #Javascript
js实现九宫格的随机颜色跳转
Feb 19 #Javascript
原生JS实现垂直手风琴效果
Feb 19 #Javascript
js鼠标移动时禁止选中文字
Feb 19 #Javascript
You might like
星际初学者游戏中永远要做的事
2020/03/04 星际争霸
php入门学习知识点七 PHP函数的基本应用
2011/07/14 PHP
如何突破PHP程序员的技术瓶颈分析
2011/07/17 PHP
PHP动态创建Web站点的方法
2011/08/14 PHP
部署PHP项目应该注意的几点事项分享
2013/12/20 PHP
PHP实现的多文件上传类及用法示例
2016/05/06 PHP
PHP实现一个轻量级容器的方法
2019/01/28 PHP
jQuery中outerHeight()方法用法实例
2015/01/19 Javascript
jQuery和AngularJS的区别浅析
2015/01/29 Javascript
js控制网页背景音乐播放与停止的方法
2015/02/06 Javascript
JavaScript学习小结(一)——JavaScript入门基础
2015/09/02 Javascript
js命名空间写法示例
2015/12/18 Javascript
JavaScript数组去重的几种方法效率测试
2016/10/23 Javascript
jsTree事件和交互以及插件plugins详解
2017/08/29 Javascript
ECMAScript6变量的解构赋值实例详解
2017/09/19 Javascript
微信小程序 swiper组件构建轮播图的实例
2017/09/20 Javascript
centos 上快速搭建ghost博客方法分享
2018/05/23 Javascript
Vue CLI4 Vue.config.js标准配置(最全注释)
2020/06/05 Javascript
Python FTP操作类代码分享
2014/05/13 Python
python编写简单爬虫资料汇总
2016/03/22 Python
Ubuntu18.04下python版本完美切换的解决方法
2019/06/14 Python
python按键按住不放持续响应的实例代码
2019/07/17 Python
Python下应用opencv 实现人脸检测功能
2019/10/24 Python
详解pycharm连接不上mysql数据库的解决办法
2020/01/10 Python
python GUI库图形界面开发之PyQt5布局控件QGridLayout详细使用方法与实例
2020/03/06 Python
使用Tensorflow-GPU禁用GPU设置(CPU与GPU速度对比)
2020/06/30 Python
python中scrapy处理项目数据的实例分析
2020/11/22 Python
html5实现九宫格抽奖可固定抽中某项奖品
2020/06/15 HTML / CSS
英国信箱在线鲜花速递公司:Bloom & Wild
2019/03/10 全球购物
美国在线肉类和海鲜配送:Crowd Cow
2020/10/02 全球购物
DELPHI面试题研发笔试试卷
2015/11/08 面试题
中职生自我鉴定范文
2013/10/03 职场文书
毕业实习个人鉴定范文
2013/12/10 职场文书
大学生自我评价范文分享
2014/02/21 职场文书
工作决心书
2014/03/11 职场文书
质量承诺书格式
2014/05/20 职场文书