zoukankan      html  css  js  c++  java
  • 【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中文乱码

  • 相关阅读:
    2018.09.25python学习第十天part3
    2018.09.25python学习第十天part2
    2018.09.25python学习第十天part1
    2018.09.21python学习第九天part3
    2018.09.21python学习第九天part2
    2018.09.21python学习第九天part1
    2018.09.20python作业
    Alpha 冲刺(3/10)
    Alpha 冲刺(2/10)
    Alpha 冲刺(1/10)
  • 原文地址:https://www.cnblogs.com/agansj/p/7866072.html
Copyright © 2011-2022 走看看