【Ajax】接收后台数据在html页面显示

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中文乱码

posted @ 2017-11-20 14:19  黑发不知勤学早  阅读(700)  评论(0编辑  收藏  举报