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 相关文章推荐
js中匿名函数的N种写法
Sep 08 Javascript
ASP.NET jQuery 实例17 通过使用jQuery validation插件校验ListBox
Feb 03 Javascript
将字符串中由空格隔开的每个单词首字母大写
Apr 06 Javascript
jquery实现无限分级横向导航菜单的方法
Mar 12 Javascript
jquery中radio checked问题
Mar 16 Javascript
AngularJS中比较两个数组是否相同
Aug 24 Javascript
Node.js下自定义错误类型详解
Oct 17 Javascript
JavaScript 轮播图和自定义滚动条配合鼠标滚轮分享代码贴
Oct 28 Javascript
BootStrap整体框架之基础布局组件
Dec 15 Javascript
JavaScript原生节点操作小结
Jan 17 Javascript
基于vue中解决v-for使用报红并出现警告的问题
Mar 03 Javascript
详解微信小程序scroll-view横向滚动的实践踩坑及隐藏其滚动条的实现
Mar 14 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
php学习笔记 PHP面向对象的程序设计
2011/06/13 PHP
深入探讨<br />和 \r\n两者有什么区别??
2013/06/05 PHP
php中strtotime函数用法详解
2014/11/15 PHP
基于php实现随机合并数组并排序(原排序)
2015/11/26 PHP
解决form中action属性后面?传递参数 获取不到的问题
2017/07/21 PHP
laravel框架邮箱认证实现方法详解
2019/11/22 PHP
jqgrid 编辑添加功能详细解析
2013/11/08 Javascript
js处理表格对table进行修饰
2014/05/26 Javascript
window.onload与$(document).ready()的区别分析
2015/05/30 Javascript
js 判断所选时间(或者当前时间)是否在某一时间段的实现代码
2015/09/05 Javascript
JS操作XML实例总结(加载与解析XML文件、字符串)
2015/12/08 Javascript
Angular.js如何从PHP读取后台数据
2016/03/24 Javascript
JavaScript自定义浏览器滚动条兼容IE、 火狐和chrome
2017/01/05 Javascript
jQuery中绑定事件bind() on() live() one()的异同
2017/02/23 Javascript
ES6新特性八:async函数用法实例详解
2017/04/21 Javascript
在使用JSON格式处理数据时应该注意的问题小结
2017/05/20 Javascript
基于JavaScript实现评论框展开和隐藏功能
2017/08/25 Javascript
浅谈Vue.nextTick 的实现方法
2017/10/25 Javascript
jQuery实现文件编码成base64并通过AJAX上传的方法
2018/04/12 jQuery
jQuery实现通过方向键控制div块上下左右移动的方法【测试可用】
2018/04/26 jQuery
js中的reduce()函数讲解
2019/01/18 Javascript
七行JSON代码把你的网站变成移动应用过程详解
2019/07/09 Javascript
微信小程序实现原生步骤条
2019/07/25 Javascript
JS实现图片幻灯片效果代码实例
2020/05/21 Javascript
Openlayers3实现车辆轨迹回放功能
2020/09/29 Javascript
单利模式及python实现方式详解
2018/03/20 Python
Python 实现选择排序的算法步骤
2018/04/22 Python
Python selenium抓取微博内容的示例代码
2018/05/17 Python
python GUI库图形界面开发之PyQt5选项卡控件QTabWidget详细使用方法与实例
2020/03/01 Python
Python基于进程池实现多进程过程解析
2020/04/30 Python
会展策划与管理专业大学生职业生涯规划
2014/02/07 职场文书
《最大的“书”》教学反思
2014/02/14 职场文书
《周恩来的四个昼夜》观后思想汇报范文两篇
2014/09/10 职场文书
师德师风自查材料
2014/10/14 职场文书
党员违纪检讨书怎么写
2014/11/01 职场文书
观看焦裕禄观后感
2015/06/09 职场文书