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


    Java代码

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

    Ajax代码

    复制代码
     1  $(document).ready(function() {
     2     $.ajax({
     3     url : "newsservlet",//请求地址
     4     dataType : "json",//数据格式 
     5     type : "post",//请求方式
     6     async : false,//是否异步请求
     7     success : function(data) {   //如何发送成功
     8     var html = "";
     9     for(var i=0;i<data.length;i++){    //遍历data数组
    10             var ls = data[i];     
    11             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>";
    12         }
    13         $("#ulul").html(html); //在html页面id=ulul的标签里显示html内容
    14     },
    15 })
    16 })
    复制代码

     HTML页面

    1   <ul id="ulul">
    2               
    3              </ul>

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

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

  • 相关阅读:
    Vue学习之路5-v-model指令
    Vue学习之路4-v-bind指令
    Laravel 中的 Many-To-Many
    laravel获取checkbox值的小技巧
    查看 Laravel 的 SQL 语句的方法
    那些好用的插件(持续更新)
    写代码原则
    Laravel 5.5 Blade::if 简介
    Laravel 项目使用 Carbon 人性化显示文章发表时间
    php7简短而安全的数组遍历方法
  • 原文地址:https://www.cnblogs.com/jpfss/p/9546252.html
Copyright © 2020-2023  润新知